Có nên combine JavaScript và CSS trong WordPress?

Nếu bạn đã từng thử test tốc độ của blog/ website với các công cụ như Google PageSpeed Insights, GTMetrix hay Pingdom thì chắc hẳn bạn cũng đã từng nhìn thấy lời khuyên là phải combine JavaScript và CSS để giúp tăng điểm tốc độ rồi phải không nào? Combine (hay “gộp”) là một thuật ngữ dùng để chỉ việc gộp chung nhiều file JS thành 1 file JS duy nhất, nhiều file CSS thành 1 file CSS duy nhất.

Có nên combine JavaScript và CSS trong WordPress hay không?

co-nen-combine-javascript-va-css-trong-wordpress-khong

Nếu bạn đã từng thử test tốc độ của blog/ website với các công cụ như Google PageSpeed Insights, GTMetrix hay Pingdom thì chắc hẳn bạn cũng đã từng nhìn thấy lời khuyên là phải combine JavaScript và CSS để giúp tăng điểm tốc độ rồi phải không nào? Combine (hay “gộp”) là một thuật ngữ dùng để chỉ việc gộp chung nhiều file JS thành 1 file JS duy nhất, nhiều file CSS thành 1 file CSS duy nhất. Điều này được cho là sẽ làm giảm số lượng HTTP request, qua đó giúp tăng tốc độ load cho blog/ website của bạn.

Tham khảo thêm:

Combine JavaScript và CSS trong WordPress

Trong WordPress, bạn hoàn toàn có thể triển khai kỹ thuật này một cách đơn giản với sự trợ giúp của plugin. Có rất nhiều plugin chuyên dụng (chẳng hạn như Autoptimize) hoặc các plugin tạo cache (chẳng hạn như LiteSpeed Cache, WP Rocket, WP Fastest Cache, W3 Total Cache…) được tích hợp sẵn tính năng này. Bạn chỉ cần một vài thao tác là đã có thể kích hoạt được nó. Tuy nhiên, không phải lúc nào việc combine JS, CSS cũng là điều tốt.

Khi nào bạn không nên combine JavaScript và CSS?

Mặc dù cũng trang bị sẵn tính năng combine JS, CSS trên plugin của mình. Tuy nhiên, các lập trình viên của WP Rocket lại khuyến cáo bạn không nên kích hoạt tính năng này nếu hosting/ server của bạn hỗ trợ giao thức HTTP/2. Tại sao vậy?

khong-combine-js-va-css-neu-hosting-ho-tro-http-2

Thứ nhất, khác với giao thức HTTP/1.1, giao thức HTTP/2 có cách truyền tải dữ liệu hoàn toàn mới. Nó tương tự như cách chúng ta combine JS, CSS. Các dữ liệu sẽ được gộp chung vào một kết nối TCP (multiplexed) để giảm số lượng HTTP request. Các bạn có thể thấy rõ điều đó thông qua hình minh họa bên dưới.

so-sanh-http-1-1-va-http-2

Như vậy, việc combine JS, CSS bằng plugin là điều không cần thiết. Để biết blog/ website của mình có đang hỗ trợ giao thức HTTP/2 hay không, các bạn có thể kiểm tra tại đây.

hosting-ho-tro-http-2

Thứ hai, combine JS, CSS rất dễ gây lỗi giao diện. Do nhiều file JS, CSS chỉ có thể hoạt động bình thường nếu chúng nằm riêng rẽ một chỗ. Nếu gộp chung với các file khác, chúng sẽ bị lỗi ngay, khiến cho giao diện web bị vỡ hoặc các chức năng không thể hoạt động được.

Kết luận

Tóm lại, nếu blog/ website của bạn có hỗ trợ giao thức HTTP/2 thì không nhất thiết bạn phải tìm cách để combine JavaScript và CSS. Bạn chỉ nên làm điều này nếu việc combine không làm ảnh hưởng đến giao diện và các tính năng của web. Đừng quá quan tâm đến cảnh báo của Google PageSpeed Insights, GTMetrix hay Pingdom về việc combine JS, CSS. Bởi vì chúng vẫn đang áp dụng các tiêu chuẩn và lời khuyên dành cho HTTP/1.1 chứ không phải HTTP/2. Tất nhiên, nếu việc combine JS, CSS vừa làm tăng tốc độ load thực tế, vừa không gây lỗi giao diện lại giúp bạn tăng điểm test tốc độ thì chẳng có lý do gì để không làm cả.

Bạn có đang áp dụng kỹ thuật combine JS, CSS trên blog/ website của mình hay không? Bạn nghĩ gì về vấn đề mà tôi vừa đề cập ở trên. Đừng quên chia sẻ với chúng tôi những quan điểm và ý kiến của bạn trong khung bình luận bên dưới.

Nếu bạn thích bài viết này, hãy subscribe blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất qua email nhé. Cảm ơn rất nhiều. :)


Bài liên quan