HomeHướng dẫn WordPress

Cách giảm kích thước file CSS và Javascript trong WordPress

Like Tweet Pin it Share Share Email

CSS và Javascript thường là thủ phạm làm cho website tải chậm.

Do vậy giảm bớt kích thước file CSS và Javascript cũng là một cách tăng tốc WordPress

Trong bài viết này bạn sẽ biết cách giảm kích thước file CSS và Javascript.

Giảm kích thước là gì?

Chắc bạn đã đoán được giảm kích thước là gì.

Giảm kích thước file hay thuật ngữ tiếng anh là minify đơn giản là cách làm giảm dung lượng file.

Các file sẽ trở nên nhỏ hơn sau khi minify. File nhẹ hơn đồng nghĩa sẽ tải nhanh hơn.

Việc giảm kích thước file sẽ áp dụng với các file tĩnh như CSS, Javascript và HTML.

Về bản chất, những file này có thể giảm bớt kích thước nhờ vào việc loại bỏ khoảng trắng và các ký tự không cần thiết.

Giảm kích thước file cũng là cách bạn cải thiện điểm khi kiểm tra tốc độ qua các công cụ như Google PageSpeed, GTMetrix hay Pingdom.

Nếu bạn có vấn đề về giảm kích thước file, Googel PageSpeed sẽ có thông báo như sau:

minify css và javascript 1

Bây giờ chúng ta sẽ xem cách giải quyết vấn đề minify Javascript và CSS.

Minify Javascript/CSS trong WordPress

Đầu tiên bạn cần cài đặt và plugin Autoptimize. Nó là plugin phổ biến trong việc tối ưu file Javascript và CSS. Từ đó nó giúp cải thiện tốc độ website của bạn.

Đây là cách nó tăng tốc website của bạn:

Plugin kết hợp lại các file script và css, giảm thiểu kích thước và nén chúng. Không chỉ có vậy plugin còn cache chúng.

Vậy cách sử dụng plugin ra sao?​

Việc sử dụng plugin cũng tương đối đơn giản. Ngay sau khi plugin đã được kích hoạt, bạn đi tới Settings -> Autoptimize. Bạn cũng có thể thấy một icon Optimize trên thanh Admin Bar. Đây là cách nhanh nhất để truy cập khu vực cấu hình của plugin.

Ở đây bạn chỉ cần chọn các mục optimize cho 3 kiểu file CSS, HTML và CSS. Sau đó, bạn click vào nút Save changes and empty cache.

minify css và javascript 2

Bây giờ bạn có thể kiểm tra lại website của bạn bằng công cụ Google PageSpeed Insights xem đã hết lỗi minify Javascript/CSS.

Đó là tất cả. Qua bài viết này bạn đã biết cách xử lý vấn đề minify CSS/Javascript.

Nếu bạn còn biết cách nào hay để minify CSS/Javascript, hãy chia sẻ trong phần bình luận bên dưới.

icon made by http://www.flaticon.com/authors/freepik from ww.flaticon.com

Managed hosting Godaddy

Để lại bình luận

Là người đầu tiên bình luận

wpDiscuz
Scroll Up
Share This