Trong bài viết này mình sẽ hướng dẫn cấu hình WP Rocket theo kiểu cầm tay chỉ việc giúp bạn tăng tốc website nhanh mà không yêu cầu quá nhiều về kỹ thuật, cấu hình cực dễ ai cũng làm được, phương pháp cấu hình áp dụng cho tất cả website và hosting, hãy chuẩn bị plugin chúng ta cùng tăng tốc website nào.
Tại sao bạn nên dùng WP Rocket
Có tốc độ load nhanh là yêu cầu bắt buộc với mọi website WordPress, tăng tốc độ load giúp cải thiện trải nghiệm của người dùng, đáp ứng các yêu cầu về Core Web Vitals thúc đẩy thứ hạng SEO. Theo mình để cải thiện tốc độ load của website bạn cần làm 3 công việc chính gồm: nén ảnh, cài đặt plugins cache và tối ưu database.
WP Rocket là plugin trả phí có mức giá 59$/năm tuy nhiên những thứ mà nó mang lại hoàn toàn xứng đáng, WP Rocket cải thiện 50% – 80% tốc độ load, tương thích với gần như tất cả themes và plugins, cấu hình rất đơn giản, bất cứ ai cũng có thể cấu hình được mà không yêu cầu can thiệp code quá nhiều.
WP Rocket sử dụng được trên mọi web server Apache, LiteSpeed, NGINX… có thể dùng WP Rocket cho những trang web cỡ nhỏ hoặc trung bình đều rất ổn định, WP Rocket có thời gian tạo cache nhanh, tương đương với LiteSpeed Cache. Vì là một plugin có tính tương thích cao nên WP Rocket hiếm khi xảy ra lỗi, bạn là người mới dùng WordPress thì đây là lựa chọn hoàn hảo.
Cài đặt WP Rocket
WP Rocket là một plugin trả phí, bạn nên mua trực tiếp từ nhà sản xuất để nhận được sự hỗ trợ và cập nhật phiên bản mới thường xuyên, giá của WP Rocket hiện tại cũng chỉ khoảng 59$/website mỗi năm. Sau khi mua plugin hãy upload zip để cài đặt.
WP Rocket
Tăng tốc độ load website lên đến 80%, mức giá chỉ 59$/năm
Sau khi cài plugin nếu gặp hiện tượng wp-admin tải quá chậm bạn truy cập cài đặt > WP Rocket sau đó vào tab preload tắt tùy chọn active preloading, tiếp tục ấn save changes.
Cài đặt xong hãy vào phần dashboard của WP Rocket nhé, ở phần này có 3 thông tin quan trọng mà bạn cần quan tâm.
- Phần thông tin về bản quyền ngày hết hạn
- Phần clear cache giúp bạn xóa toàn bộ cache trên website
- Phần rocket tester cho phép trải nghiệm những phiên bản mới và công nghệ mới, phần rocket analytics cho phép tìm hiểu và thống kê các thông số về tốc độ trên website
Tính năng rocketCDN hiện vẫn chưa hỗ trợ máy chủ cho người dùng Việt Nam nên bạn không cần quan tâm đến tính năng này, khi lưu lượng truy cập website quá cao có thể tham khảo qua các dịch vụ CDN trong nước hoặc CloudFlare bản miễn phí.
Cấu hình WP Rocket cache
WP Rocket có 9 tab cấu hình chính bây giờ chúng ta sẽ đi từng tab một nhé, cache là một yêu cầu bắt buộc đối với mọi website, tính năng này giúp tăng tốc độ load, giảm các yêu cầu truy vấn trên database.
- Mobile cache: tùy chọn này bạn chọn bật, ở phần separate cache files for mobile devices plugin sẽ giúp tạo file cache và tối ưu hóa các CSS JS riêng biệt cho thiết bị di động
- User cache: phần này sẽ giúp cache cho người dùng đăng nhập, các trang web điển hình cho kiểu cache này là diễn đàn, trang web học trực tuyến, web bán hàng… mình khuyên bạn hãy tắt tùy chọn này để giảm tải cho máy chủ
- Cache lifespan: đây là tùy chọn thời gian tồn tại của cache, khi hết hạn cache sẽ tự động xóa và tạo lại cache mới, hãy set về 0 để cache không bao giờ bị xóa
Sau khi cấu hình hãy ấn vào save changes để lưu lại các tùy chọn.
File optimization
Ở tab này có khá nhiều tùy chọn để cấu hình chuẩn và không bị lỗi giao diện yêu cầu bạn phải làm thật kỹ càng, các tùy chọn ở đây chủ yếu là để xử lý các yêu cầu về CSS và JS. Bật hết tất cả các tùy chọn từ trên xuống dưới nếu phát sinh lỗi giao diện hoặc tính năng, hãy tắt từng tùy chọn một cho đến khi hết lỗi thì thôi, nên ưu tiên tắt tùy chọn optimize CSS delivery.
CSS Files
- Minify CSS files: nén các file CSS
- Combine CSS files: gộp các file CSS
- Optimize CSS delivery: đây là tính năng khá quan trọng cũng là tính năng phiền phức gây ra rất nhiều lỗi nếu bạn không hiểu được cơ chế hoạt động của nó, giải thích ngắn gọn và việt hóa nhất có thể thì đây là tính năng tạo CSS quan trọng giúp loại bỏ tài nguyên chặn hiển thị, tăng tốc độ load, chọn hình thức tạo load css asynchronously.
Khi bật tính năng optimize CSS delivery sẽ cần thời gian từ 5 phút – 10 phút để máy chủ của WP Rocket tạo các CSS quan trọng, trong thời gian này bạn nên bình tĩnh chờ đợi để plugin thực hiện tính toán và tạo file CSS.
JavaScrips files
Ở phần này hãy bật cả các tùy chọn, đây là phần khá quan trọng nếu làm không kỹ có thể ảnh hưởng đến tính năng của toàn bộ website, đặc biệt là các tối ưu liên quan đến jQuery.
- Minify javascript files: nén các file javascript
- Combine javascript files: gộp các file javascript, ở hai ô số 1 và số 2 trong hình đó là tính năng nâng cao của WP Rocket bạn không cần phải điền gì hết
- Tiếp theo là tính năng load javascript deferred: trì hoãn tải các file javascript, chú ý kỹ ở phần excluded javascript files bạn nhớ điền đầy đủ các ký tự này /jquery-?[0-9.]*(.min|.slim|.slim.min)?.js nếu không khả năng bị lỗi sẽ rất cao.
- Delay JavaScript execution: đây là tính năng giúp trì hoãn các mã script bên thứ ba ví dụ như: Facebook chat, Facebook pixel, Google Analytics, tawk to… tính năng này khá hay vì có thể cải thiện khoảng 15 điểm Google PageSpeed Insights.
Media
Giải thích sơ qua thì lazyload là tính năng tải lười chỉ khi bạn đọc nội dung thì các file media và iframe mới được tải, xem demo tính năng này tại web.dev. Nếu muốn loại trừ lazyload thành phần nào hãy điền vào danh sách excluded images or iframe, có thể điền theo class, tên file hoặc tên miền.
Tính năng giúp tự động thêm thuộc tính chiều rộng và chiều cao cho các hình ảnh còn thiếu giúp cải thiện các lỗi về bố cục.
Preload
Preload Cache
Phần này khá quan trọng đối với mọi website, khi dùng tính năng preload nếu không cẩn thận có thể làm hosting sập hoặc preload ngầm quá nhiều gây ảnh hưởng đến tốc độ load của website.
Để hiểu về cơ chế preload cache thì đầu tiên bạn phải hiểu về cơ chế tạo cache đã, cơ chế tạo cache rất đơn giản khi một người nào đó truy cập một trang web chưa có cache thì plugin sẽ xử lý và tạo cache cho trang đó. Người đầu tiên truy cập trang web khi chưa có cache nên sẽ load rất chậm, bắt đầu từ người dùng truy cập thứ hai tốc độ sẽ nhanh hơn vì trang web đã có cache.
Vậy preload cache là gì? hiểu đơn giản đó là tính năng tạo trước cache dựa trên tài nguyên của hosting, tính năng preload cache giúp cho mọi người dùng khi truy cập trang web đều có tốc độ nhanh như nhau.
Những website nào nên bật tính năng này? mình thường chỉ bật tính năng này trên những website sử dụng vps hoặc hosting business, khi preload cache plugin sẽ tự động tạo cache dựa trên sitemaps của webiste, nhập url tùy chỉnh nếu không muốn preload cache.
Preload links và prefetch DNS requests
Tính năng preload links này giúp tải trang trước khi người dùng di chuột vào một liên kết nội bộ bất kỳ, hãy bật tính năng này nếu bạn dùng hosting business bởi vì nó tiêu tốn khá nhiều tài nguyên.
Tiếp theo đó là tính năng prefetch DNS requests sẽ giúp tìm nạp trước các DNS từ trang web bên ngoài, để bật tính năng này bạn copy danh sách tên miền mình cung cấp rồi dán vào phần urls to prefetch.
Preload font
Khi bạn sử dụng Google PageSpeed Insights để kiểm tra tốc độ công cụ này sẽ có đề xuất tải trước các fonts, bạn copy link file này và dán vào ô fonts to preload như vậy sẽ giúp cải thiện tốc độ load.
Advanced rules
Với tùy chọn này bạn có thể thiết lập không cache cho các url tùy chỉnh, đối với các url giỏ hàng, thanh toán… thuộc Woocommerce sẽ được WP Rocket tự động nhận diện và không bao giờ cache, để loại trừ các url cache bạn thêm url vào danh sách theo cú pháp mỗi url trên 1 dòng.
Ví dụ 1: bạn không muốn cache trang https://tenmien.com/gioi-thieu/ hãy điền dòng này vào list /gioi-thieu/
Ví dụ 2: bạn không muốn cache danh sách các sản phẩm như bên dưới
https://tenmien.com/san-pham/iphone-6s
https://tenmien.com/san-pham/iphone-7s
https://tenmien.com/san-pham/iphone-xthì cấu trúc khi bạn thêm vào list sẽ là:
/san-pham/(.*)Lưu ý cực kỳ quan trọng khi cấu hình và cài đặt WP Rocket đó là đừng bao giờ thêm các url chỉ có /(.*) điều này sẽ khiến toàn bộ trang web của bạn không được cache.
- Never cache cookies: không bao giờ cache cookies
- Never cache user agent(s): không bao giờ cache đối tượng người dùng
- Always purge url(s): luôn luôn xóa cache khi cập nhật bài viết hoặc trang
- Cache query string(s): cache các truy vấn query
Tất cả tùy chọn trên là nâng cao bạn có thể để trống.
Database
Đây là phần giúp dọn dẹp toàn bộ cơ sở dữ liệu trên website giúp giải phóng các dữ liệu dư thừa như bài đăng trong thùng rác, bình luận spam, các bản lưu nháp… để cấu hình phần này bạn bật tất cả tùy chọn và ấn save changes and optimize để plugin tự động dọn dẹp.
Với tính năng automatic cleanup plugin sẽ lên lịch dọn dẹp dữ liệu theo ngày (daily), theo tuần (weekly) hoặc theo tháng (monthly), dựa trên kinh nghiệm sử dụng mình khuyên bạn nên chọn theo tháng đây là cách tối ưu nhất.
Ở tab CDN hãy để như mặc định, không cần làm gì hết.
Heartbeat
Heartbeat là tính năng giúp đồng bộ dữ liệu theo thời gian thực giữa máy chủ và trình duyệt, các hoạt động điển hình như tự động lưu bài viết, thông báo trên trang quản trị, các tác vụ AJAX… tuy đây là tính năng rất thiết yếu trên WordPress nhưng nó cũng có thể làm cạn kiệt tài nguyên trên hosting nếu bạn không biết kiểm soát.
WP Rocket sẽ giới hạn hoạt động của heartbeat bằng tính năng control heartbeat, mặc định plugin sẽ giới hạn heartbeat 2 phút mỗi lần, để cấu hình chuẩn nhất bạn chọn reduce activity.
Các add-ons
WP Rocket có rất nhiều add-ons nhưng bạn chỉ cần quan tâm đến 2 add-ons CloudFlare và WebP thôi, để WebP hoạt động bạn cài đặt rất phức tạp và cũng cần cài đặt thêm ShortPixel hoặc Smush Pro để tạo ảnh WebP, ảnh WebP chỉ thực sự hữu dụng ở những website lớn với số lượng bài viết lên đến hàng nghìn.
Website của bạn đã cài đặt CloudFlare rồi thì hãy thiết lập thêm api để quá trình xóa cache dễ dàng hơn, còn nếu cảm thấy quá lười thì hãy bỏ qua bước này vì nó cũng không quan trọng, đăng nhập vào CloudFlare để lấy API key.
Bước kế tiếp lấy zone id của website trên CloudFlare.
Cuối cùng nhập các thông tin api key vào WP Rocket.
Ở tab image optimization chủ yếu là để quảng cáo plugin nén ảnh Imagify của hãng, nếu website của bạn vẫn chưa dùng bất cứ plugin nén ảnh nào, hãy dùng thử, Imagify hiện đang miễn phí 20MB dung lượng ảnh hàng tháng cho mọi khách hàng.
Tool
Phần này cho phép xuất và nhập các cài đặt để cấu hình nhanh hơn cho những lần sau, tính năng rollback giúp bạn quay trở lại những phiên bản WP Rocket cũ hơn nếu phiên bản hiện tại bị lỗi hoặc không tương thích.
Cuối cùng là phần tutorials là nơi đăng các hướng dẫn của nhà sản xuất, hãy xem những hướng dẫn ở đây nếu bạn cần tối ưu nâng cao, trong quá trình cấu hình nếu gặp khó khăn gì hãy để lại bình luận mình sẽ cố gắng phản hồi nhanh nhất có thể.
