“Tên lửa”? À không phải mình giật tít gì đâu vì nó là tên của WP Rocket mà. Đây là điểm website của mình trên GTmetrix sau khi cài đặt WP Rocket.
WP Rocket có lẽ là plugin tạo cache tốt nhất hiện nay cho WordPress. Sau đây mình xin hướng dẫn cách cài đặt WP Rocket để tăng tốc website của bạn.
Xem thêm: WordPress là gì? Tại sao bạn nên sử dụng WordPress.
Nhưng trước hết chúng ta hãy tìm hiểu WP Rocket là gì và các tính năng của nó ra sao đã nhé?
WP Rocket là gì?
WP Rocket là plugin tạo cache cho website WordPress.
Đây là một plugin premium (trả phí) rất mạnh mẽ mà mình thấy là website nào lớn cũng sử dụng.
Cách cài đặt thì lại rất đơn giản hơn so với những plugin tạo cache khác.
Nhưng mà cái gì cũng có cái giá của nó phải không bạn? Đây là bảng giá của WP Rocket:
Tuy nhiên đi kèm với các giá đó là các tính năng vô cùng hấp dẫn:
Một số tính năng mà bạn có thể thấy quen quen như Lazyload (cuộn trang đến đâu thì tải hình tới đó).
Điều này giúp tăng tốc độ tải trang lên rất đáng kể.
Bạn có thể sử dụng plugin Lazyload riêng nhưng nó đã được tích hợp vào WP Rocket rồi nên không việc gì phải cài thêm cho nặng.
Một số tính năng khác mà bạn hay gặp là tương thích với Cloudflare, hay nén GZIP và Remove query string để nâng cao điểm GTmetrix.
Xem thêm: Cloudflare là gì? Hướng dẫn sử dụng Cloudflare.
Còn đây là bảng so sánh giữa WP Rocket và các plugin miễn phí khác như WP Super Cache hay W3 Total Cache.
Dù so sánh như vậy hơi khập khiễng nhưng mình sẽ thấy được là mua WP Rocket có đáng đồng tiền bát gạo hay không?
Sau khi xem xét các tính năng trên, có lẽ giờ đây bạn đang rất hào hứng muốn cài “em nó” vào ngay website của mình.
Vậy thì còn đợi gì nữa mà không làm ngay thôi.
Hướng dẫn cài đặt WP Rocket.
Đầu tiên bạn mua và tải về WP Rocket tại đây. Nếu chưa có điều kiện bạn có thể mua lại trên các website mua bán plugin uy tín.
Nếu bạn sợ tiền mất tật mang thì hãy để lại comment ở dưới mình sẽ chia sẻ lại với 1 vài điều kiện nho nhỏ.
Sau đó thì bạn cài đặt và kích hoạt plugin này như bình thường.
Lưu ý: Trước khi cài WP Rocket bạn phải tắt hết các plugin Lazyload và plugin tạo cache như WP Super Cache hay W3 Total Cache.
Sau khi đã kích hoạt thành công thì WP Rocket sẽ tự chạy nên bạn không cần làm gì thêm.
Nhưng để tối ưu plugin này chúng ta nên cấu hình WP Rocket thêm một số tính năng sau.
Tips: Nếu muốn biết WP Rocket đã chạy hay chưa chỉ cần mở trên website của bạn trên một trình duyệt khác.
Sau đó nhấn Ctr + U để xem nguồn trang. Nếu có dòng WP Rocket cuối chân trang là đã chạy.
Nếu bạn đang sử dụng Cloudflare thì có thể không thấy vì tính năng tối ưu HTML của Cloudflare đã cắt nó đi.
Sau đây mình sẽ đi vào khám phá từng tab một của WP Rocket nhé. Lưu ý đây là bản 3.2.4 nên giao diện có thể hơi khác một xíu so với các bản cũ hơn.
1/ Dashboard
Đây là trang tổng quan về tài khoản của bạn như loại license, ngày hết hạn.
- Remove all cached files – Xóa tất cả các file cache
- Start cache preloading – Tạo lại file cache
2/ Cache
Thường thì trong tab này mình để mặc định, không chỉnh sửa gì cả!
- Enable caching for mobile devices – Kích hoạt tạo cache cho thiết bị di động
- Separate cache files for mobile devices – Tách file cache dành cho thiết bị di động. Nếu giao diện của bạn là responsive thì không cần.
- Enable caching for logged-in WordPress users – Kích hoạt tạo cache cho người dùng đã đăng nhập. Bạn sẽ không nhìn thấy thay đổi khi chỉnh sửa CSS hay giao diện.
- Specify time after which the global cache is cleared (0 = unlimited) – Đặt thời gian xóa cache sau một khoảng thời gian nào đó, đặt về 0 nếu không muốn xóa cache
3/ File optimization
Đây là sẽ phần quan trọng nhất. Cứ tick xong một cái thì bạn phải tải lại trang xem có vấn đề gì không đã nhé!
Nếu có thì bỏ tick cái vừa tick ✅ xong. Nếu không thì mới làm tiếp.
- Minify CSS files – Nén file CSS
- Combine CSS files (Enable Minify CSS files to select) – Gộp các file CSS lại thành một, phải kích hoạt tính năng Minify CSS files ở trên trước. Không nên bật nếu website của bạn có hỗ trợ HTTP/2
- Optimize CSS delivery – Tối ưu hóa việc phân phối các file CSS, loại bỏ các tài nguyên chặn hiển thị trên Google PageSpeed Insights
- Remove Unused CSS (Beta) – Loại bỏ các đoạn, file CSS không dùng đến. Cải thiện điểm trên Google PageSpeed Insights.
- Minify JavaScript files – Nén file JavaScript
- Combine JavaScript files (Enable Minify JavaScript files to select) – Gộp các file JavaScript lại thành một, phải kích hoạt Minify JavaScript files trước. Không nên bật nếu website của bạn có hỗ trợ HTTP/2. Nếu bạn bật tính năng trì hoãn JavaScript ở dưới thì cái này tự động tắt (bị mờ đi).
- Load JavaScript deffered – Tối ưu hóa việc tải các file JavaScript, khắc phục lỗi JS chặn hiển thị nội dung trên Google PageSpeed Insights
- Delay JavaScript execution – Trì hoãn tải các file JavaScript. Tức là khi tải trang bạn sẽ thấy 1 khoảng trắng. Khi nào cuộn trang thì nội dung mới hiện ra. Có lúc thì Google sẽ cho đây là không thân thiện với thiết bị di động.
4/ Media
- Enable for images – Bật LazyLoad cho hình ảnh (cuộn trang đến đâu thì tải hình ảnh đến đó)
- Enable for iframes and vides – Bật LazyLoad cho iframe và video
- Disable Emoji – Vô hiệu hóa Emoji (biểu tượng cảm xúc trong WordPress)
- Disable WordPress embeds – Vô hiệu hóa Embed Script
5/ Preload
- Active preloading – Kích hoạt Preload, WP Rocket sẽ tạo lại cache khi cache lifespan hết hạn (mặc định phần trước là 10 giờ)
- Activate sitemap-based cache preloading – Kích hoạt preload dựa vào XML Sitemap
Xem thêm: XML Sitemap là gì? Hướng dẫn tạo Sitemap trên WordPress.
- Yoast SEO XML sitemap – Sử dụng XML Sitemap được tạo ra bởi Yoast SEO
- URLs to prefetch – Tìm nạp trước DNS, có thể làm cho các tệp tin ngoài host tải nhanh hơn
Gõ mỗi URL là một dòng, bắt đầu bằng // và không có giao thức HTTP. Ví dụ của mình sẽ là 2 tệp font từ ông lớn Google:
- //fonts.gstatic.com
- //fonts.googleapis.com
6/ Advanced rules
Tab này dùng để tối ưu các plugin của các trang thương mại điện tử. Nếu website của bạn không phải thì có thể bỏ qua.
Thông tin thêm bạn xem tại đây.
7/ Database
Trước khi đụng chạm vào tab này, bạn nên backup website trước nhé. Vì tab này sẽ xóa vào cơ sở dữ liệu của bạn.
Xem thêm: Hướng dẫn backup và phục hồi website bằng BackupBuddy.
- Post Cleanup – Dọn dẹp các bản sửa đổi, các bản nháp tự động lưu và các bài viết nằm trong thùng rác
- Comments Cleanup – Dọn dẹp các bình luận spam hay nằm trong thùng rác
- Transients Cleanup – Dọn dẹp các thông tin tạm thời không còn sử dụng nữa ví dụ số lượt like, share bài viết lên mạng xã hội
- Database Cleanup – Dọn dẹp cơ sở dữ liệu liên quan đến các theme, plugin đã bị xóa
- Automatic Cleanup – Lên lịch dọn dẹp tự động. Nếu bạn chưa lên lịch backup website tự động (hoặc ít nhất là database) thì không nên chọn
8/ CDN
- Enable Content Delivery Network – Kích hoạt nếu website của bạn có sử dụng CDN (MaxCDN, KeyCDN…). Nếu bạn sử dụng CloudFlare thì để phần sau
- CDN CNAME(s) – Điền link CDN của bạn ví dụ như cdn.example.com. Trong mục reserved for bạn có thể chọn toàn bộ file, chỉ hình ảnh, CSS & JavaScript, chỉ JavaScript hoặc chỉ CSS trên CDN
- Exclude files from CDN – Điền URL của những file mà bạn không muốn chạy trên CDN
Mình sử dụng Cloudflare nên mục này để trống.
9/ Heartbeat
Heartbeat API cung cấp kết nối giữa trình duyệt và máy chủ theo thời gian thực.
Ví dụ như khi mình viết bài này thì WordPress sẽ tự động lưu các bản nháp và các bản sửa đổi lên máy chủ.
Tab này bạn có thể cấu hình (Heartbeat WP Rocket) như sau:
Bạn có thể giảm hoặc vô hiệu hóa Heartbeat để giảm tải cho máy chủ.
Khi bạn chọn giảm (Reduce) thì tần số kết nối ban đầu là 1 phút 1 lần sẽ thành 2 phút 1 lần (tức giảm 50%).
Bạn không nên vô hiệu hóa (Disable) Heartbeat hoàn toàn vì có thể ảnh hưởng đến theme và plugin chạy dựa vào API này.
10/ Add-ons
- Google Tracking – Tăng điểm Browser Cache của Pingdom, GTmetrix và Google PageSpeed khi cho phép WP Rocket lưu file Google Analytics trên máy chủ của web bạn thay vì máy chủ của Google
- Facebook Pixel – Tương tự như Google Analytics nhưng cho Facebook Pixel
- Varnish – Bật ON nếu host của bạn hỗ trợ Varnish cache
Nếu bạn sử dụng Cloudflare thì bật ON sau đó nhấn MODIFY OPTIONS – Cloudflare CDN WP Rocket.
Ở đây có 3 mục chúng ta cần điền vào là Global API key, Zone ID (bạn đăng nhập vào Cloudflare để lấy) và email tài khoản Cloudflare.
- Development mode – Bật ON nếu bạn tạm thời không muốn CloudFlare cache dữ liệu website, dùng khi bạn chỉnh sửa các file CSS hoặc JavaScript. Nếu không thì bạn F5 mỏi tay luôn mà cũng không thấy thay đổi.
- Optimal settings – Bật ON nếu bạn muốn WP Rocket tự động tối ưu các thiết lập cho CloudFlare
- Relative protocol – Chỉ sử dụng với flexible SSL của CloudFlare. URL của các file tĩnh sẽ bị ghi đè thành // thay vì http:// hay https://
Xem thêm: Hướng dẫn cài SSL Cloudflare miễn phí.
- Clear all CloudFlare cache files – Xóa tất cả file cache trên CloudFlare
11/ Image optimization
WP Rocket cung cấp cho bạn plugin IMAGIFY để tối ưu hình ảnh cho WordPress. Bạn có thể sử dụng các plugin khác như WP Smush It.
12/ Tools
Đây là bộ công cụ của WP Rocket
- Export Settings – Tải về file chứa các thiết lập của WP Rocket mà chúng ta đã làm từ đầu đến giờ để sử dụng với website khác mà không cần phải cấu hình lại từ đầu
- Import Settings – Tải lên file cài đặt WP Rocket. Tất nhiên là bạn đã có sẵn 1 bản tải về như trên
- Rollback – Quay về phiên bản WP Rocket cũ hơn nếu gặp vấn đề với phiên bản mới
Vậy là mình đã hướng dẫn các bạn cách cài đặt WP Rocket một cách khá chi tiết rồi đó.
Nếu bạn cần thêm thông tin thì có thể tham khảo tài liệu hướng dẫn của WP Rocket tại đây.
Chúc website của bạn đạt 100 điểm trên GTmetrix và nhanh như tên bắn.
Leave a Reply