Kết hợp các tệp JS hoặc CSS với PHP
Viết bởi Saran vào ngày 12 tháng 9 năm 2013 , Cập nhật ngày 24 tháng 5 năm 2017
Kết hợp các tệp Javascript và CSS và có thể giảm đáng kể số lượng yêu cầu HTTP mà trang của bạn thực hiện, giúp trang web của bạn nhẹ hơn và nhanh hơn. Đó là một trong những điều chỉnh để cải thiện hiệu suất trang web của bạn. Đoạn mã này không thu nhỏ tệp, nó chỉ đơn giản là kết hợp nhiều tệp thành một tệp duy nhấtPHP
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
function combine_my_files[$array_files, $destination_dir, $dest_file_name]{
if[!is_file[$destination_dir . $dest_file_name]]{ //continue only if file doesn't exist
$content = "";
foreach [$array_files as $file]{ //loop through array list
$content .= file_get_contents[$file]; //read each file
}
//You can use some sort of minifier here
//minify_my_js[$content];
$new_file = fopen[$destination_dir . $dest_file_name, "w" ]; //open file for writing
fwrite[$new_file , $content]; //write to destination
fclose[$new_file];
return ''; //output combined file
}else{
//use stored file
return ''; //output combine file
}
}
Cách sử dụng
Chỉ cần tạo danh sách các tệp bạn muốn kết hợp, sau đó gọi hàm để thực hiện phần còn lại. Đảm bảo đường dẫn đích có thể ghi và chính xácPHP
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
$files = array[
'//example/files/sample_js_file_1.js',
'//example/files/sample_js_file_2.js',
'//example/files/beautyquote_functions.js',
'//example/files/crop.js',
'//example/files/jquery.autosize.min.js',
];
echo combine_my_files[$files, 'minified_files/', md5["my_mini_file"].".js"];
Đây là một cách tiếp cận đơn giản, nhưng đã có nhiều tập lệnh và thư viện PHP mạnh mẽ như cái này hoặc cái này, có thể dễ dàng kết hợp và thu nhỏ các tệp Javascript và CSS của bạn Nhưng, để tránh hiểu lầm, chẳng phải tốt hơn là thay thuật ngữ "mô-đun" bằng một từ khác sao?
Liên kết để bình luậnChia sẻ trên các trang web khác
MắtXác định
Đăng ngày 24 tháng 6 năm 2016
MắtXác định
- Các thành viên
- 142
- 108
- Vị tríThụy Điển
- Tác giả
- Chia sẻ
Đăng ngày 24 tháng 6 năm 2016
2 phút trước, ottogal said
Cách thú vị để xử lý nhiều tệp css
Nhưng, để tránh hiểu lầm, chẳng phải tốt hơn là thay thuật ngữ "mô-đun" bằng một từ khác sao?
Xin chào. Có lẽ nó có thể dẫn đến nhầm lẫn
Nhưng lý do tôi sử dụng thuật ngữ "mô-đun" là vì mục tiêu của các mô-đun CSS mà tôi gọi chúng là để chúng độc lập với các mô-đun khác
Ở đó tôi sử dụng thuật ngữ mô-đun.
Tôi sử dụng lý do này sau khi đọc hướng dẫn CSS có thể duy trì mà tôi liên kết đến trong bài đăng của mình
Nhưng bạn có thể gọi nó là những gì phù hợp với bạn nhất và bạn cảm thấy thoải mái với
Nó chỉ là một thuật ngữ tôi sử dụng cho bản thân mình để hiểu mục đích của các tệp mô-đun là gì
Liên kết để bình luậnChia sẻ trên các trang web khác
tpr
Đăng ngày 24 tháng 6 năm 2016
tpr
- Các thành viên
- 2. 3k
- 3,247
- Vị tríBudapest, Hungary
- Chia sẻ
Đăng ngày 24 tháng 6 năm 2016
Tôi sẽ thêm bộ đệm đánh dấu vào ngăn xếp, với 0 thời gian chờ đối với siêu người dùng và một vài phút đối với người dùng thông thường
Nhưng tôi ổn với quy trình làm việc scss/gulp hiện tại của mình, sử dụng bao gồm. Imho, nó cũng dễ bảo trì và mở rộng hơn, nhưng yêu cầu môi trường nhà phát triển hoạt động
Liên kết để bình luậnChia sẻ trên các trang web khác
MắtXác định
Đăng ngày 24 tháng 6 năm 2016
MắtXác định
- Các thành viên
- 142
- 108
- Vị tríThụy Điển
- Tác giả
- Chia sẻ
Đăng ngày 24 tháng 6 năm 2016 [đã chỉnh sửa]
15 phút trước, tpr nói
Tôi sẽ thêm bộ đệm đánh dấu vào ngăn xếp, với 0 thời gian chờ đối với siêu người dùng và một vài phút đối với người dùng thông thường
Nhưng tôi ổn với quy trình làm việc scss/gulp hiện tại của mình, sử dụng bao gồm. Imho, nó cũng dễ bảo trì và mở rộng hơn, nhưng yêu cầu môi trường nhà phát triển hoạt động
Tôi nghĩ rằng bạn đã hiểu sai về việc sử dụng kịch bản này
Nó chỉ là một công cụ dành cho nhà phát triển để xử lý việc hợp nhất CSS thành một tệp duy nhất
Chỉ dành cho nhà phát triển chứ không phải người dùng trang web
Người dùng sẽ chỉ trải nghiệm tệp được hợp nhất với tất cả CSS kiểm soát giao diện trang web
Cập nhật. tôi hiểu những gì bạn có nghĩa là bằng cách đánh dấu bộ nhớ cache bây giờ. hiểu lầm bạn
Chỉnh sửa ngày 24 tháng 6 năm 2016 bởi EyeDentifyhiểu lầm
Liên kết để bình luậnChia sẻ trên các trang web khác
tpr
Đăng ngày 24 tháng 6 năm 2016
tpr
- Các thành viên
- 2. 3k
- 3,247
- Vị tríBudapest, Hungary
- Chia sẻ
Đăng ngày 24 tháng 6 năm 2016
Tôi có thể, nhưng tôi vẫn không thấy lợi ích nào hơn less/sass/postcss, v.v. Khi lưu các tệp scss/less/etc đi kèm hoặc tệp chính, CSS cuối cùng sẽ được biên dịch tự động, không cần phải làm gì cả
Liên kết để bình luậnChia sẻ trên các trang web khác
MắtXác định
Đăng ngày 24 tháng 6 năm 2016
MắtXác định
- Các thành viên
- 142
- 108
- Vị tríThụy Điển
- Tác giả
- Chia sẻ
Đăng ngày 24 tháng 6 năm 2016
32 phút trước, tpr nói
Tôi có thể, nhưng tôi vẫn không thấy lợi ích nào hơn less/sass/postcss, v.v. Khi lưu các tệp scss/less/etc đi kèm hoặc tệp chính, CSS cuối cùng sẽ được biên dịch tự động, không cần phải làm gì cả
Vấn đề là, mọi người có cách làm việc khác nhau
Tôi chỉ thích sử dụng CSS cũ đơn giản ngay từ đầu và không cảm thấy nó đáng để loay hoay với Ít/scss hoặc thứ tương tự
Đó là cách tôi sử dụng tập lệnh PHP này.
Nhưng như tôi đã nói, đó là cái hay trong thời đại phát triển web của chúng ta mà bạn có thể chọn cách phù hợp nhất với mình
Và bạn có thể chạy tất cả các loại hàm chuỗi trên tệp css chính khi nó được hợp nhất để giả sử thu nhỏ và như vậy
Tôi biết bạn cũng có thể làm điều đó với quy trình làm việc của mình
Nhưng tôi cũng thấy đây là một cơ hội để sử dụng PHP làm những việc khác nhau. Bên cạnh đó tôi thích thử nghiệm
- 1
Liên kết để bình luậnChia sẻ trên các trang web khác
Bị MấtKobrakai
Đăng ngày 24 tháng 6 năm 2016
Bị MấtKobrakai
- Người điều hành PW
- 4. 9k
- 5,286
- Vị tríMunich, Đức
- Chia sẻ
Đăng ngày 24 tháng 6 năm 2016
Nếu bạn đang sử dụng hệ thống dựa trên unix thì đây cũng có thể là một tùy chọn. http. // định hình. com/cach-doi-cho-doi/