Mình đã theo dõi WordPress 7.1 từ thời Beta 1, và một thay đổi đáng chú ý nhất về performance đang đến rất gần: Speculative Loading sẽ chuyển từ chế độ conservative sang moderate mặc định khi phát hiện caching. Đây là tính năng có thể giảm thời gian load trang xuống còn dưới 100ms mà không cần cài thêm plugin nào.
Trong bài này, mình sẽ hướng dẫn bạn từ A đến Z: hiểu Speculative Loading là gì, kiểm tra site có sẵn sàng chưa, và cách cấu hình tối ưu cho WordPress 7.1 khi nó ra mắt ngày 19/8/2026.
Speculative Loading Là Gi Va Sao No Quan Trọng?
Speculative Loading (tải dự đoán) là kỹ thuật trình duyệt preload hoặc pre-render trang trước khi người dùng click. Dựa trên Speculation Rules API của Chrome/Edge, trình duyệt sẽ đoán xem người dùng sắp ghé trang nào, rồi tải sẵn HTML, CSS, JavaScript trong background. Khi người dùng thực sự click, trang hiện ra gần như tức thời.
WordPress 7.1 thay đổi mức độ mặc định từ conservative (chỉ prefetch đường dẫn cùng domain) lên moderate (cả prefetch lẫn pre-render). Nghĩa là thay vì chỉ tải trước một phần, trình duyệt sẽ render sẵn toàn bộ trang trong background. Kết quả: thời gian hiển thị trang có thể giảm từ 1-2 giây xuống còn gần 0 giây.
Cách Kiểm Tra Site WordPress Da Bat Speculative Loading Chua
Hiện tại, nếu bạn đang chạy WordPress 7.0.x, Speculative Loading vẫn ở chế độ conservative. Bạn có thể kiểm tra trạng thái hiện tại bằng cách mở Chrome DevTools:
1. Mở trang web của bạn trong Chrome
2. Nhấn F12 de mo DevTools
3. Vao tab Application > Speculative loads
4. Kiem tra muc Speculation rules va trang thai Prerender hoa Prefetch
Nếu bạn thấy thông báo “No speculation rules found”, site chưa bật tính năng này. Đừng lo, WordPress 7.1 sẽ tự động xử lý.
Site WordPress Cua Ban Co San Sang Cho Moderate Mode?
Chế độ moderate pre-render trang trong background, nghĩa là trình duyệt sẽ tải và render trang đầy đủ trước khi người dùng click. Điều này tuyệt vời cho tốc độ, nhưng bạn cần đảm bảo site không gặp các vấn đề sau:
1. Session và Cookie: Trang pre-render sẽ chạy JavaScript ngay trong background. Nếu code của bạn đếm page view bằng JavaScript ngay khi trang load, bạn có thể đếm thừa. Hãy chuyển sang đếm khi có tương tác thực sự (click, scroll).
2. Analytics: Google Analytics 4 đã hỗ trợ prerendering tốt, nhưng một số script tracking cũ thì chưa. Kiểm tra xem script tracking có fire event ngay DOMContentLoaded hay không – nếu có, cần delay đến khi trang thực sự hiển thị.
3. Personalization: Nếu trang hiển thị nội dung khác nhau cho từng user (logged-in vs logged-out), pre-render có thể hiển thị sai nội dung. WordPress 7.1 đã xử lý trường hợp is_user_logged_in(), nhưng plugin custom cần được kiểm tra.
Huong Dan Cau Hinh Speculative Loading Cho WordPress 7.1
Khi WordPress 7.1 ra mắt, nó sẽ tự động thêm Speculation Rules vào <head> khi phát hiện caching (plugin cache hoặc server cache). Nhưng bạn có thể tinh chỉnh thêm.
Kiểm tra xem rules đã được thêm:
# Xem source HTML của trang chủ
curl -s https://yourdomain.com/ | grep -i "speculationrules"
# Kết quả mong đợi:
# <script type="speculationrules">{...}</script>Nếu muốn override mức độ (ví dụ: tắt trên trang checkout):
// Thêm vào functions.php của theme
add_filter( 'wp_speculation_rules_href_patterns', function( $patterns ) {
// Loại bỏ trang thanh toán khỏi pre-render
$patterns = array_filter( $patterns, function( $pattern ) {
return strpos( $pattern, '/checkout/' ) === false;
});
return $patterns;
});
// Hoặc tắt hoàn toàn trên trang cụ thể
add_filter( 'wp_speculation_rules_eagerness', function( $eagerness ) {
if ( is_page( 'checkout' ) || is_page( 'cart' ) ) {
return ''; // Tắt speculative loading
}
return $eagerness;
});Tùy chỉnh eagerness (mức độ “nóng”):
// Mặc định: moderate (cả prefetch + prerender)
// Bạn có thể giữ conservative cho trang nhạy cảm
add_filter( 'wp_speculation_rules_eagerness', function( $eagerness ) {
if ( is_account_page() || is_checkout() ) {
return 'conservative'; // Chỉ prefetch, không pre-render
}
return $eagerness; // Giữ moderate cho phần còn lại
});Cách Test Speculative Loading Tren WordPress 7.1 Beta
Nếu bạn muốn test ngay bây giờ trước khi 7.1 chính thức ra mắt, mình khuyên dùng WordPress Playground:
1. Truy cập https://playground.wordpress.net/
2. Chọn WordPress 7.1 Beta 3
3. Cài plugin Gutenberg mới nhất
4. Mở Chrome DevTools > Application > Speculative loads
5. Di chuột qua các link trên trang
6. Quan sát tab Speculative loads hiển thị các URL đang được pre-render
Nếu bạn có staging site, hãy cập nhật lên WordPress 7.1 Beta 3 và test trực tiếp:
# Tải WordPress 7.1 Beta 3
sudo -u www-data wp core download --version=7.1-beta3 \
--path=/var/www/yourdomain.com/public_html \
--force
# Hoặc dùng WP-CLI để chuyển phiên bản
sudo -u www-data wp core update --version=7.1-beta3 --path=/var/www/yourdomain.com/public_htmlSau khi cập nhật, mở Chrome DevTools và kiểm tra tab Speculative loads. Bạn sẽ thấy các URL được pre-render khi hover qua link.
Anh Huong Cua Speculative Loading Den Core Web Vitals
Speculative Loading ảnh hưởng trực tiếp đến Largest Contentful Paint (LCP) và First Contentful Paint (FCP). Khi trang được pre-render, LCP có thể giảm xuống gần 0 vì trình duyệt đã render xong toàn bộ nội dung.
Tuy nhiên, cần lưu ý:
Core Web Vitals đo trên navigation thực sự, không phải trên pre-render. Nghĩa là khi người dùng click và trang pre-render hiện ra, Chrome sẽ báo cáo LCP/FCP rất thấp. Điều này tốt cho điểm Core Web Vitals của bạn.
Nhưng CrUX data (dữ liệu thực tế từ người dùng) sẽ phản ánh đúng improvement, trong khi Lab data (PageSpeed Insights, Lighthouse) không mô phỏng được pre-render. Đừng ngạc nhiên nếu Lab data không thay đổi nhưng CrUX cải thiện rõ rệt.
Cac Loi Thuong Gap Va Cach Khac Phuc
Loi 1: Trang pre-render hiển thị sai nội dung
Nguyên nhân: Plugin cache trả nội dung cũ khi pre-render. Khắc phục: đảm bảo cache plugin hỗ trợ Vary: Sec-Purpose header. WordPress 7.1 đã gửi header Sec-Purpose: prefetch hoặc prerender trong request.
# Kiểm tra server có gửi đúng header không
curl -I -H "Sec-Purpose: prefetch" https://yourdomain.com/
# Đảm bảo Nginx không cache riêng cho prerender request
# Thêm vào nginx.conf:
map $http_sec_purpose $skip_cache {
default 0;
~*prefetch 0; # Cache bình thường
~*prerender 0; # Cache bình thường
}Loi 2: Analytics double-count
Giải pháp: Sử dụng Page Activation API thay vì pageshow event. Google Analytics 4 đã hỗ trợ.
// Kiểm tra trang có đang bị pre-render không
if (document.prerendering) {
document.addEventListener('prerenderingchange', function() {
// Chỉ fire analytics khi trang thực sự hiển thị
gtag('event', 'page_view');
});
} else {
gtag('event', 'page_view');
}Loi 3: Pre-render tiêu tốn bandwidth
WordPress 7.1 mặc định chỉ pre-render tối đa 2-3 trang. Nhưng nếu site bạn nặng (nhiều image, video), có thể giới hạn:
add_filter( 'wp_speculation_rules_max_urls', function() {
return 2; // Giới hạn pre-render tối đa 2 trang
});WordPress 7.1 Speculative Loading Co Ho Tro Firefox Va Safari?
Hiện tại, Speculation Rules API chỉ hoạt động trên Chrome 121+ và Edge 121+. Firefox đang thử nghiệm (flag dom.speculation_rules.enabled), còn Safari chưa công bố kế hoạch.
Điều này không sao cả. Speculative Loading là progressive enhancement – trình duyệt không hỗ trợ sẽ bỏ qua, không gây lỗi. WordPress 7.1 kiểm tra User-Agent trước khi thêm rules, nên site chạy Firefox/Safari sẽ không nhận script thừa.
Tuy nhiên, theo thống kê, Chrome + Edge chiếm khoảng 65-70% traffic web toàn cầu. Nghĩa là phần lớn người dùng site của bạn sẽ được hưởng lợi ngay.
Checklist Chuan Bi WordPress 7.1 Cho Speculative Loading
Trước khi WordPress 7.1 ra mắt 19/8/2026, hãy hoàn thành checklist sau:
1. Kiểm tra PHP version – WordPress 7.1 yêu cầu PHP 8.1+. Chạy php -v de xac nhan
2. Backup full site – database, files, config trước khi nâng cấp
3. Kiểm tra analytics – đảm bảo dùng GA4 hoặc script hỗ trợ prerendering
4. Review plugin cache – cập nhật plugin cache mới nhất, đảm bảo tương thích
5. Test trên staging – nâng cấp lên 7.1 Beta 3 trên môi trường test trước
6. Kiểm tra personalization – nếu có nội dung dynamic, test pre-render
7. Chuẩn bị rollback – giữ backup WordPress 7.0.x phòng khi cần quay lại
Ket Luan
Speculative Loading là một trong những cải tiến performance đáng giá nhất của WordPress 7.1. Chỉ cần nâng cấp lên 7.1 khi nó ra mắt, site của bạn sẽ tự động được pre-render trên Chrome/Edge, giảm đáng kể thời gian load trang mà không cần plugin.
Nhưng để tận dụng tối đa, hãy kiểm tra analytics, cache plugin, và personalization trước. Test trên staging với Beta 3 ngay hôm nay để không bị bất ngờ khi bản chính thức ra mắt.
Nếu bạn đang tìm hiểu thêm về tối ưu tốc độ WordPress, hãy đọc bài hướng dẫn tối ưu tốc độ WordPress 2026 mà mình đã viết chi tiết từ A đến Z.
