Minify HTML, CSS và JavaScript trong WordPress với Autoptimize

Minify HTML, CSS và JavaScript trong WordPress với Autoptimize

Với một blog/website thì tốc độ tải trang là một yếu tố rất quan trọng, ảnh hưởng tới trải nghiệm người dùng và SEO. Có rất nhiều cách để tăng tốc độ tải trang như dùng hosting tốc độ cao, bộ nhớ đệm – cache, nén hình ảnh, tối ưu database, CDN,… Một trong những cách này thì đơn giản nhất là bạn có thể sử dụng phương pháp minify.

Minify là gì?

Minify là phương pháp sử dụng kỹ thuật gộp các tập tin CSS và JavaScript nhỏ lẻ thành một tập tin lớn để người dùng có thể tải toàn bộ trong cùng một lúc khi truy cập vào website. Các tập tin sau khi được minify sẽ lưu vào trong trình duyệt của người dùng giúp tăng tốc cho lần truy cập thứ hai.

Minify

Phương pháp minify này có được gọi là giảm bớt hay nén không làm mất đi thành phần nào của CSS và JavaScript mà chỉ lược bỏ các khoảng trắng, dấu xuống hàng rồi gộp chúng lại thành một.

Có thể bạn sẽ cần: 4 Plugin tối ưu hóa hình ảnh tốt nhất cho WordPress

Sử dụng plugin Autoptimize

Minify có thể làm thủ công nhưng nó hơi rắc rối cho những bạn không rành lập tình hay quản lý các tập tin trên VPS chẳng hạn. Nếu như bạn không sử dụng các plugin cache như WP Super Cache hay W3 Total Cache thì hoàn toàn có thể sử dụng các plugin cho việc minify HTML, CSS và JavaScript.

Trong bài này mình sẽ giới thiệu một plugin được rất nhiều blogger lớn trên thế giới khuyên dùng, đặc biệt là những người sáng lập ra Easy Engine (script mình đang sử dụng).

Autoptimize là một plugin miễn phí với gần 1 triệu lượt tải với xếp hạng 4.7/5 sao tại thư viện plugin của WordPress. Tác dụng của plugin này là giúp bạn tăng tốc độ tải trang cho WordPress bằng phương pháp minify mình đã nói bên trên.

Ngoài ra, Autoptimize còn hỗ trợ cả CDN nếu bạn có chi phí để sử dụng dịch vụ này. Mình nghèo nên cũng chưa thử nữa 🙁

Để sử dụng bạn cần tìm và cài đặt plugin Autoptimize sau đó kích hoạt plugin này lên. Sau khi đã kích hoạt, bạn truy cập DashBoards > SettingsAutoptimize sau đó tick vào những lựa chọn mong muốn. Trong đó:

  • HTML Options: Nén trang HTML bằng cách xóa bớt khoảng trắng.
  • JavaScript Options: Gộp các tập tin JS của các plugin lại thành một.
  • CSS Options: Gộp CSS của theme và plugin đang sử dụng.
  • CDN Options: Tùy chọn cho kết nối CDN.

Thiết lập Autoptimize plugin

Bạn có thể nhấn vào chức năng Show advanced settings để hiện ra những tính năng nâng cao. Nếu như bạn không rành thì cũng không nên đụng vào vì nó có thể ảnh hưởng đến một số chức năng của giao diện, gây mất thẩm mỹ.

Sau khi lựa chọn thì bạn nhấn Save Changes hoặc Save Changes and Empty Cache để lưu lại.

Autoptimize sẽ thêm một công cụ vào thanh Admin Bar để bạn có thể xem thông tin và xóa cache nhanh chóng, việc này sẽ giúp trang web cập nhật khi bạn có chỉnh sửa liên quan tới CSS.

Sử dụng plugin  Autoptimize rất đơn giản phải không? Mình thấy plugin này khá nhẹ và giúp trang web tăng tốc đáng kể. Nói chung là hài lòng 😀

Nếu bạn có plugin nào hay cho việc Minify HTML, CSS và JavaScript trong WordPress thì có thể để lại bình luận nhé. Mình sẽ dành thời gian để test và đưa tới các bạn những plugin hay nhất, tốt nhất.

Minify HTML, CSS và JavaScript trong WordPress với Autoptimize
3.6 (7 votes)

Để lại một bình luận

9 Bình luận trên "Minify HTML, CSS và JavaScript trong WordPress với Autoptimize"

avatar
500
Hoàng Trí
Khách

Xài Plug in cache rocket thì có cần phải dùng thêm cái này không nhỉ ?

Nam Ngô
Khách

Rocket hình như có chức năng này mà nhỉ

Sơn Standa
Khách

Dùng cái này có xảy ra hiện tượng lỗi ảnh không Nam ơi?

Nam Ngô
Khách

Không nha bác

Thể Hình
Khách

Sao mình dùng cái này xong nó chạy bất thường ghê, lúc ok lúc cực chậm, có khi load cả chục giây mới lên hình (tắt thì lại bình thường ?? )

Nam Ngô
Khách

Lúc trước mình xài thấy đâu có bị chậm đâu nhỉ

Đặng Việt Thạo
Khách

Có 1 lần mình cũng dùng cái Minimize data nhưng khi ra giao diện web mất sừ hết ảnh, thế mới bùn

Dung
Khách

Bạn cho hỏi phần Inline and Defer CSS mình có thể chèn 2 file css vào được không

wpDiscuz
Đăng kí BẢN TIN

Đăng kí BẢN TIN

Đăng kí bản tin to cập nhật bài viết nhanh nhất and receive the following phần quà hấp dẫn từ Nam Ngô Blog.

Bạn đã đăng kí thành công!