Trong bài viết này mình sẽ hướng dẫn cấu hình WP Rocket 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, hãy chuẩn bị plugin và tiến hành tăng tốc cho website của mình nào.
WP Rocket là plugin có hiệu năng rất tốt trong việc tăng tốc website WordPress, ưu điểm plugin này đó là nhanh gọn lẹ cùng với cộng đồng hỗ trợ đông đảo, tham khảo ngay group mua chung WP Rocket của mình nếu bạn chưa có plugin nhé.
TẠI SAO NÊN DÙNG WP ROCKET
Tối ưu hóa tốc độ website là yêu cầu bắt buộc trong năm 2021, 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 trong SEO.
Có rất nhiều plugin tối ưu tốc độ website mỗi plugin đều có ưu điểm và khuyết điểm khác nhau nhưng mình quyết định chọn WP Rocket bởi vì ưu điểm dễ dùng, tương thích cao, cải thiện 80% tốc độ sau khi dùng. Tốc độ cải thiện trước và sau khi dùng WP Rocket.
CÀI ĐẶT PLUGIN 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 49$/website mỗi năm.
MUA PLUGIN WP ROCKET CHÍNH HÃNG
Cam kết chính hãng và sạch 100%, hỗ trợ 24/7/365 mọi vấn đề
Sau khi mua bạn tải file zip của plugin về và tiến hành upload để cài đặt.
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 thì bạn 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 bạn 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 của bạn
Tính năng RocketCDN hiện vẫn chưa hỗ trợ máy chủ cho người dùng Việt Nam cho 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 của bạn 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 dạng cache này là diễn đàn, trang web học trực tuyến, web bán hàng… mình khyê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, lời khuyên của mình hãy set về 0 để cache không bao giờ bị xóa
Sau khi cấu hình hãy ấn vào nút 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ạn bật hết tất cả các tùy chọn từ trên xuống dưới nếu website phát sinh lỗi về 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 thành 1
- 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
Khi bật tính năng Optimize CSS delivery sẽ cần thời gian từ 5-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 mình note 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 vô cùng quan trọng vì nó có thể cải thiện khoảng 40% tốc độ load.
Ở tùy chọn này nếu muốn delay mã javascript nào bạn chỉ cần điền tên miền vào list là được, ví dụ bạn muốn delay mã Facebook Pixel hãy điền vào list connect.facebook.net hoặc bạn muốn delay Tawk To live chat hãy điền tên miền tawk.to vào list. Bạn cũng có thể áp dụng list mặc định mà WP Rocket đã cung cấp mà không cần phải chỉnh sửa gì thêm, nhớ ấn vào Save changes để lưu lại các thay đổi.
MEDIA
Ở phần media bạn bật hết tất cả các tùy chọn trừ phần Enable Webp caching, lưu ý rằng WP Rocket không thể tạo ảnh webp cho website của bạn để tạo được ảnh webp bạn cần một plugin khác như Imagify hoặc ShortPixel.
LazyLoad
Giải thích sơ qua thì lazyload là tính năng tải lười biếng 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 không muốn 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.
Image Dimensions, Embebs và WebP compatibility
- Image Dimensions: tính năng này sẽ thêm thông số về chiều rộng chiều cao giúp loại bỏ các lỗi thay đổi bố cục trên trang
- Disable WordPress embems: bỏ tính năng nhúng trên WordPress
- WebP compatibility: tính năng giúp hiển thị các hình ảnh webp tương thích với trình duyệt, để tránh đau đầu mình khuyên bạn không nên bật tính năng này
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 bạ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 web sẽ load rất chậm, khi có cache rồi thì từ người thứ hai trở đi tốc độ load của trang sẽ nhanh hơn.
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 máy chủ, 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 độ cao và đều có cache.
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, để sử dụng tính năng này trơn tru nhất bạn bật toàn bộ tùy chọn như hình bên dưới sau đó điền sitemaps của Rank Math hoặc Yoast SEO vào.
Sitemaps của Rank Math và Yoast SEO sẽ có dạng tenmien.com/sitemap_index.xml
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ỳ, những website sử dụng hosting giá rẻ hãy tắt tính năng này.
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 bên dưới rồi dán vào phần URLs to prefetch.
//maps.googleapis.com
//maps.gstatic.com
//fonts.googleapis.com
//fonts.gstatic.com
//ajax.googleapis.com
//apis.google.com
//google-analytics.com
//www.google-analytics.com
//ssl.google-analytics.com
//youtube.com
//api.pinterest.com
//cdnjs.cloudflare.com
//connect.facebook.net
//platform.twitter.com
//syndication.twitter.com
//platform.instagram.com
//disqus.com
//sitename.disqus.com
//s7.addthis.com
//platform.linkedin.com
//w.sharethis.com
//i0.wp.com
//i1.wp.com
//i2.wp.com
//stats.wp.com
//pixel.wp.com
//s.gravatar.com
//0.gravatar.com
//2.gravatar.com
//1.gravatar.com
Preload font
Khi bạn sử dụng Google PageSpeed Insights để kiểm tra tốc độ công cụ này sẽ có yêu cầu tải trước các yêu cầu chính, 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
Never Cache URL(s)
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 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ó / hoặc /(.*) điều này sẽ khiến toàn bộ trang web của bạn không được cache.
Các phần còn lại
- 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ả các tùy chọn ở trên đều nâng cao bạn có thể bỏ trống và không cần điền gì hết.
DATABASE
Đây là phần giúp dọn dẹp toàn bộ cơ sở dữ liệu trên website của bạn 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 tuần đây là cách tối ưu nhất.
Tiếp theo đến tab CDN bạn bỏ trống không cần điền 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 ADDONS CỦA WP ROCKET
Ở phần Addons bạn bật các tiện ích Google Tracking, Facebook Pixel và CloudFlare nếu bạn có sử dụng.
- Google Tracking Addons: lưu mã Google Analytics trên host giúp tăng tốc độ load
- Facebook Pixel Addons: lưu mã Facebook Pixel trên host giúp tăng tốc độ load
- CloudFlare Addons: tương thích trực tiếp với CloudFlare giúp quản lý cache
Nếu website của bạn phục vụ hầu hết cho người dùng Việt Nam thì có thể cân nhắc không dùng CloudFlare, việc cài đặt CloudFlare khá phức tạp với người mới trong khi tốc độ cũng không cải thiện thêm là bao.
Để cấu hình phần CloudFlare chuẩn nhất bạn truy cập vào tài khoản lấy các mã API key, Zone ID, Email. Việc đăng ký tài khoản CloudFlare như thế nào bạn có thể tham khảo thêm trên Youtube.
- Bước 1: Vào trang tài khoản chọn website và copy ZoneID như trong hình
- Bước 2: Ấn vào Get your API token để lấy API key
Sau khi hệ thống chuyển bạn đến trang profile hãy tìm đến phần Global API key và chọn VIEW, tiếp theo đó nhập mật khẩu CloudFlare để lấy API KEY.
Bước cuối cùng điền toàn bộ API key, Zone ID, Email theo yêu cầu nhớ bật luôn 2 tùy chỉnh Optimal settings và Relative protocol.
Ở 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 có thể cài plugin này vào để dùng thử, Imagify hiện đang miễn phí 25MB dung lượng ảnh hàng tháng cho mọi khách hàng.
TOOL
Phần này cho phép bạn 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 của bạn 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 hãy để lại bình luận mình sẽ giải đáp nhanh trong 24h.
