Top 4 plugins minify dữ liệu tốt nhất cho blog WordPress.
Một trong những tiêu chí mà Google và các công cụ tìm kiếm khác đánh giá trang web của bạn là tốc độ load. Đây cũng là một trong những tiêu chí hàng đầu để khách truy cập đánh giá trang web của bạn, đặc biệt là trong lần đầu tiên họ ghé thăm. Nếu trang web của bạn mất quá nhiều thời gian để load, rất có thể khách truy cập sẽ rời khỏi nó và không bao giờ quay trở lại. Mạng internet có quá nhiều sự lựa chọn khác dành cho họ, thay vì phải chờ đợi.
Tham khảo thêm:
- Minify HTML, Javascript và CSS mà không cần plugin
- Làm thế nào để giảm bớt HTTP requests cho WordPress?
Trang web của bạn có thể tải rất nhiều file, bao gồm HTML, CSS và cả JavaScript. Bạn cần phải làm cho những code này trở nên sạch sẽ, tối ưu và tải nhanh nhất có thể. Vấn đề là chúng được viết để đọc bởi con người. Do đó, chúng chứa rất nhiều không gian màu trắng (white space), comments và cả những định dạng mà máy tính không cần đến. May mắn thay, điều này hoàn toàn có thể được khắc phục. Một cách tuyệt vời để giúp tăng tốc độ các tập tin của bạn là minify (hay giảm bớt) nó. Việc minify có thể thực hiện bằng cách thủ công hoặc bằng plugins. Tuy nhiên, nếu bạn không biết nhiều về code thì plugins là thứ mà bạn nên lựa chọn.
Những plugins minify dữ liệu tốt nhất trong WordPress
Trong bài viết này, tôi sẽ giới thiệu đến các bạn top 4 plugins giúp minify dữ liệu (HTML, CSS, JS) tốt nhất hiện nay dành cho blog WordPress.
1. Better WordPress Minify – Download
Plugin miễn phí này sẽ cho phép bạn combine (kết hợp) và minify (giảm bớt) các tập tin CSS và JS. Nó cải thiện khả năng tương thích với các plugins và themes khác bằng cách sử dụng hệ thống enqueueing của WordPress. Bạn có thể di chuyển các tập tin enqueued đến vị trí bạn muốn, chẳng hạn như tiêu đề hoặc chân trang và bạn có thể thực hiện rất nhiều điều chỉnh từ bảng điều khiển. Nó cũng tương thích với multisite. Đây là một trong những plugins tốt nhất để tăng tốc trang web WordPress của bạn.
2. AssetsMinify – Download
Đây là một plugin miễn phí giúp minify CSS và JS của bạn. Nó không có quá nhiều thiết lập nên rất dễ sử dụng. Sau khi lựa chọn một số ít thiết lập (hoặc bạn có thể để theo mặc định, trừ khi bạn muốn sử dụng “Use Compass“), bạn có thể chọn nén hoặc không nén các tập tin, các script và các tập tin ngoại lệ.
3. WP Super Minify – Download
Plugin miễn phí này sẽ giúp bạn nén CSS, JS và HTML. Nó có ít thiết lập nhất trong số các plugins mà tôi đã thử – bạn chỉ cần chọn nén hay không nén JS và CSS. Chỉ có bấy nhiêu thôi. Bạn không thể loại trừ bất kỳ tập tin nào hoặc xóa bộ nhớ cache. Bạn có thể xem mã nguồn của trang web (bấm CTRL + U) và nó sẽ cho bạn thấy kích thước tập tin trước và sau khi nén. Tôi thực sự thích tính năng này. Bởi vì, bạn sẽ có được một cái nhìn thực tế về kết quả từ những nỗ lực tối ưu của mình.
4. WP Minify Fix – Download
Đây là một bản cập nhật dành cho plugin WP Minify. Với plugin miễn phí này, bạn có thể nén JS, CSS và HTML cũng như thiết lập các tập tin được minify hoặc không được minify. Có rất nhiều tinh chỉnh và tùy chọn như vị trí của các file JS (header hoặc footer), HTML5 sync tag và nhiều hơn nữa. Nó thậm chí cho phép sử dụng các URL đẹp. Bạn cũng có thể truyền các tham số bổ sung cho công cụ minify dữ liệu.
Bạn đang sử dụng plugins hay giải pháp nào để minify dữ liệu blog/ website WordPress của mình? Hãy chia sẻ nó với chúng tôi bằng cách sử dụng 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. :)
Anh cho em hỏi là web anh đang dùng plugin comment gì vậy ạ?
Cái này là hệ thống bình luận mặc định của WordPress bạn ạ. Mình không dùng plugin gì cả.
Hiếu ơi nếu mình không minify CSS và JS thì có sao không Hiếu, vì mình thấy load chậm đi rõ rệt. Mình chỉ minify HTML thôi. Vậy ổn không Hiếu ?
Có ai bắt buộc bạn phải minify CSS và JS đâu? Làm thế nào đó để thấy web load nhanh là được. :P
Xài mấy cái này có rủi ro làm đơ web ko Hiếu vì mình thấy nó đụng chạm đến mấy file php trong khi mình rất gà mờ về mấy cái code :( À mình đang dùng MyThemeShop.
Nó nén HTML, JS và CSS chứ có động chạm gì đến file PHP của theme đâu mà sợ đơ web hả bạn? :D Cài vào mà nó lỗi gì đó thì chỉ cần gỡ ra là xong mà. Nó tạo file riêng để nén chứ đâu can thiệp trực tiếp vào file theme. :P
Tốt quá, thế để mình cài thử thằng đầu tiên Better WordPress Minify :D Cảm ơn bác :D
Bạn ơi, khi mình cài plugin Better WordPress Minify thì cái wp rocket của mình nó báo như này có ảnh hưởng gì đến web không nhỉ.
“WP Rocket: The following plugins are not compatible with this plugin and may cause unexpected results: Better WordPress Minify ”
Làm thế nào để cho nó k hiển thị dòng chữ này nữa vậy
WP Rocket cũng có tính năng giống plugin Better WordPress Minify nên bạn cần xóa plugin Better WordPress Minify đi nhé. Cài cùng lúc cả 2 plugin sẽ gây xung đột. :P
mình cảm giác cài Better WordPress Minify thấy web nhanh hơn rất nhiều, nếu thế xóa wp rocket được không bạn
Nếu bạn gỡ WP Rocket thì ngoài Better WordPress Minify, bạn sẽ phải cài thêm 1 plugin tạo cache nữa. :)
Loạn hết cả lên chả biết dùng thằng nào? Còn thằng “Redis Object Cache” thì thế nào bạn?
Dùng thằng nào cũng được. Nhưng chỉ nên dùng một cái thôi. Nhiều cái là bị xung đột ngay đấy. :D Mình chưa dùng thằng “Redis Object Cache” bao giờ nên chịu. :P
Anh em rủ nhau bỏ tiền mua plugin tính phí đi. Cái gì dùng mất tiền cũng ngon ah!
Haha. Blog của mình không phải cũng đang được minify dữ liệu đây sao? Có plugin nào ngoài thị trường làm được điều này hoặc hơn? Cần gì đi mua cho mất tiền ra. :P
Bạn dùng plugin gì đó, mình mệt mỏi với mấy cái code website lắm rồi.
Hehe. Plugin do bên mình phát triển, tối ưu dành riêng cho Genesis Framework và Genesis child theme. :P
Share cho mình dùng thử được không? Mình cũng dùng Genesis Framework và Genesis child theme
Rất tiếc là không thể share được. :D Sắp tới mình sẽ tổ chức giveaway hoặc mở bán với giá siêu rẻ. Nói chung đang nghiên cứu. :P
chẳng hiểu sao càng Minify càng thấy rớt điểm còn thảm hơn khi chưa Minify , hay chỉnh sửa bằng thủ công , chẳng lẻ mình phải vác cần câu cơm xuống núi học đạo ta
Như vậy chứng tỏ là minify chưa đúng cách rồi. :D Lựa chọn theme và các plugins phù hợp quyết định rất nhiều đến tốc độ load của site. :P
Giờ plugin nào Minify HTML, JS, CSS website ngon vậy anh. Trước em dùng WordPress Rocket thấy nó Minify max ngon. Mà không có lisence lên em gỡ rồi.
Minify bằng tay là bá nhất nhé. Mỗi tội làm hơi vất vả. :D
Oài, cái món bằng tay mệt với mất thời gian lắm anh :v
Dành chút thời gian để chăm chút cho blog của mình cũng là một thú vui tao nhã mà. :P
Quan trong chỉnh tay xong, con phải edit nũa ma, ko lẻ môi lan chinh sua xong lai minify = tay lai, hic!
site đang chạy tên miền hơi bẩn bựa mà cũng chưa làm xong không muốn đi ra ngoài đợi xong rồi em đưa bác xem :D
Google pagespeed có sẵn 1 số filter minify, combine js và css đó, thủ công chi cho cực bạn.
Bạn thử copy nội dung trong các tập tin mà Google đã minify sau đó paste vào các tập tin css, js mặc định xem WordPress nó có báo lỗi không? Và Google PageSpeed chỉ minify chứ không combine bạn nhé. :P
Bạn thử xem: http://gamegialap.com.
Mình dùng GP, vừa minify vừa combine nè. Thấy bình thường mà có gì đâu ta?
Bạn kiểm tra thử xem site của bạn có mấy tập tin css, js và site của mình thì có bao nhiêu? :P
Bạn thử copy nội dung trong các tập tin mà Google đã minify sau đó paste vào các tập tin css, js mặc định xem WordPress nó có báo lỗi không? Và Google PageSpeed chỉ minify chứ không combine bạn nhé. :P
Câu trả lời có vẻ ko liên quan lắm :D.
Nếu Google PageSpeed biết combine các tập tin css và js thì khi bạn test chỉ thấy hiển thị duy nhất 1 tập tin js và 1 tập tin css thôi nhé. Đằng này site của bạn có tới 3 tập tin js và 8 tập tin css. Như thế sẽ tạo ra nhiều html request đến máy chủ hơn. Bạn hiểu ý mình không? :P Hơn nữa, khi bạn copy nội dung tập tin style.css mà Google đã minify và paste vào file style.css cũ thì WordPress sẽ báo theme của bạn bị lỗi. :P
“Nếu Google PageSpeed biết combine các tập tin css và js thì khi bạn test chỉ thấy hiển thị duy nhất 1 tập tin js và 1 tập tin css thôi nhé”
– Vấn đề là do config thôi, mình chưa optimize nên bạn thấy nhiều file là bình thường.
“Đằng này site của bạn có tới 3 tập tin js và 8 tập tin css.”
–
Đây là 1 link ví dụ cách google combine js.
==> Mình dùng Mod trên Nginx nên mình không phải động tay chân vào minify và combine, cũng không cần cài thêm plugin cho WP: https://developers.google.com/speed/pagespeed/module/filters
Đối với anh em ko có VPS thì ko xài được cách này gòi :p
Bạn nói cái mà không phải ai cũng áp dụng được thì nói làm cái gì? :D Phương pháp của mình áp dụng được cả cho shared host lẫn VPS nhé. Blog của mình cũng đang sử dụng VPS Nginx đây. Và mình chẳng cần cài Mod PageSpeed vẫn tối ưu hơn site của bạn. :P Không cần xài plugin luôn nhé. :P
Các bác nói văn hoa quá em chẳng hiểu gì, sài host 400k/ năm hawkhost 91 di động, 97 những công cụ khác time load hơn 500ms xíu
Cho mình xem site để học hỏi với. :D
“Bạn nói cái mà không phải ai cũng áp dụng được thì nói làm cái gì?” ==> Hỏi thằng Google đó, ko phải ai cũng áp dụng được thì nó làm làm gì?
Từ việc chia sẻ cách optimize blog thành việc tôi làm được anh ko làm được anh nói làm gì. Bắt đầu thấy nhảm rồi. Mình chấm dứt tranh luận nhen.
Bạn nói Google PageSpeed có sẵn rồi, làm thủ công chi cho mệt. Nhưng thực tế thì có phải ai cũng có thể áp dụng cái mà bạn đang nói đâu? Số lượng người sử dụng VPS nhiều hơn hay shared host nhiều hơn thì chắc bạn cũng biết rồi. Vậy thì là bạn đang nhảm hay là mình đang nhảm? :D
Mỗi người có 1 ý kiến mỗi ai cũng có chỗ đúng cách của bạn kia thì cho vps nhưng khổ nỗi 80% sinh viên hay tư nhân làm nguyên giờ toàn dùng host, cách của bác hiếu thì xài cho ai cũng được vì là làm thủ công nhưng cơm canh gì cái js đó lại 1 phát ăn ngay chưa chắc đã tốt giả sử đưa js xuống footer đâu phải cái nào cũng chịu nằm dưới. Mà nói thủ công chứ làm hết css với js chưa tới 5p
Nó là của cloudflare đó bác :D
Thế mình mới nói là cài CloudFlare luôn cho rồi còn gì. :P
Cái này là đưa js của mình lên không lưu trong host như kiểu google jquery đó
Theo quan điểm của mình thì tất cả mọi dữ liệu đều nên lưu trên host, không phụ thuộc vào các máy chủ bên ngoài. :-)
Host mình mua của nước ngoài mà cdnjs.com cho js chứ không phải cho cả trang
Host nước ngoài thì cứ CloudFlare or Incapsula mà quất. Cần gì dùng đến CDN khác nữa. :D
Mình làm cũng sắp xong rồi mấy ngày nay ngồi mò cái cdn cho js mà chưa được
Host bạn đặt ở đâu và lưu lượng truy cập chủ yếu từ đâu mà cần đến CDN? :P
Nếu mà sử dụng VPS thì sài cái W3 Total Cache là em thấy tốt nhất luôn, custom được từng file nữa :D
Đang dùng VPS và không sử dụng bất cứ plugin minify nào đây. Tin không? Toàn làm bằng phương pháp thủ công hết. :P
Thủ công làm gì cho khổ bác ơi -_-
Nhà có mỗi “đứa con” thôi mà. Chẳng lẽ không bỏ chút thời gian ra lo được cho nó. :P Mà nó là cái cần câu cơm của mình đấy. :D
Siêng nhất bác :D
” W3 Total Cache là em thấy tốt nhất luôn, custom được từng file ”
lam sao de chi minify tung link cu the ha ban? cua minh no nen het vao 1 file, dan de layout bi vo~
cam on ban
Nếu mình nhớ không nhầm thì W3 Total Cache cho phép loại bỏ các file mà bạn không muốn minify mà? Nếu không có thì bạn tham khảo WP Rocket xem sao nhé: https://wpcanban.com/wordpress/thu-thuat-wordpress/huong-dan-cai-dat-va-su-dung-plugin-wp-rocket.html :P
Cám ơn bạn đã trả lời.
Không phải là không muốn minify, mà ý mình là mình không muôn minify tất cả vào 1 file.
mà mình muốn minify riêng từng file.
ví dụ minh có 3 file css là:
a.css
b.css
c.css
thì khi biuld ra trình duyêt thi show source ra vẫn thấy 3 link đó, nhưng từng link đều được minify.
mình vẫn muốn dùng W3 Total Cache.
Bạn dùng CloudFlare (bật tính năng minify css, js lên) hoặc tự minify bằng tay nhé (copy code đã được minify bằng các công cụ online sau đó paste vào file). Còn không có plugin nào làm được như vậy cả. :P
oh, cám ơn.
Vậy mình làm auto như này được ko?
http://saungon.com/minify-html-code-cho-wordpress-khong-dung-plugin/
Cái này chỉ minify HTML thôi. Không minify được JS và CSS. Mình từng dùng rồi. Coi chừng vỡ giao diện + một số code không hoạt động được. :P
oh, vây để mình thử mò CloudFlare xem sao, minh dung host stable, nhưng chạy ở VN, vậy có nên xài CloudFlare hay MaxCDN????
Có điều kiện thì xài MaxCDN, còn miễn phí thì xài CF. :)