Chrome đang thay đổi để cho phép sử dụng bộ nhớ đệm quay lại/chuyển tiếp (bfcache) cho các trang sử dụng Cache-Control: no-store khi có thể thực hiện an toàn. Hãy tìm hiểu ý nghĩa của điều này đối với nhà phát triển.
Thông tin khái quát
Việc đặt Cache-Control: no-store làm tiêu đề HTTP là một tín hiệu cho biết không nên lưu trữ trang trong bộ nhớ đệm HTTP. Bạn nên sử dụng lệnh này cho các trang chứa dữ liệu nhạy cảm (ví dụ: cho các trang khi người dùng đã đăng nhập), nhưng lệnh no-store thường được dùng trên các trang không có dữ liệu nhạy cảm.
Với bfcache, thay vì huỷ một trang khi người dùng rời khỏi trang, chúng ta sẽ hoãn huỷ và tạm dừng việc thực thi JS. Nếu người dùng quay lại ngay, chúng ta sẽ hiển thị lại trang và tiếp tục thực thi JS. Điều này giúp người dùng điều hướng trang gần như ngay lập tức.
Mặc dù không bắt buộc theo thông số kỹ thuật HTML, nhưng trình duyệt thường coi Cache-Control: no-store là tín hiệu để tránh đặt trang vào bfcache. Đây là lý do lớn nhất khiến bfcache không được sử dụng, đối với khoảng 17% lượt điều hướng theo nhật ký trên thiết bị di động và 7% lượt điều hướng theo nhật ký trên máy tính. Điều này có nghĩa là các trang này không được hưởng lợi từ tính năng khôi phục nhanh và phải tải lại toàn bộ trang, bao gồm mọi lệnh gọi mạng, quá trình thực thi JavaScript và kết xuất.
Thường thì Cache-Control: no-store được đặt để tránh các vấn đề về bộ nhớ đệm khi trang web thay đổi, nhưng lý do này ít liên quan hơn khi sử dụng bfcache, vì toàn bộ trang được khôi phục gần như thể trang đó luôn mở.
Cách Chrome thay đổi hành vi này
Chrome đã thông báo ý định thay đổi hành vi này nhưng đang thận trọng với thay đổi này. Chúng tôi đã chạy các thử nghiệm kể từ Chrome 116 và cho đến gần đây, các thử nghiệm này đã chạy trên 5% số lượt tải trang.
Chúng tôi đã tăng tỷ lệ này lên 10% tải trang vào ngày 2 tháng 10 và dự định sẽ tăng thêm lên 20% tải trang vào tháng 11, 50% vào đầu năm sau, khởi chạy hoàn toàn việc này ngay sau đó, với một số lựa chọn không tham gia sẽ được thảo luận tiếp theo.
Dữ liệu nhạy cảm
Mặc dù kết quả phân tích của chúng tôi cho thấy phần lớn thao tác tiến hoặc lùi không chứa dữ liệu nhạy cảm và do đó đủ điều kiện để thêm vào bfcache, nhưng có một số trường hợp mà các trang không nên được đưa vào bfcache. Ví dụ: khi đăng xuất, bạn không thể truy xuất trang đã đăng nhập bằng cách di chuyển lui hoặc tới.
Để tránh điều này, Chrome sẽ xoá một trang khỏi bfcache khi có thay đổi đối với cookie hoặc các phương thức uỷ quyền khác.
Ngoài ra, việc sử dụng các API sau đây cho các trang sử dụng Cache-Control: no-store sẽ tiếp tục khiến các trang đó không đủ điều kiện sử dụng bfcache:
Xin lưu ý rằng đây không phải là danh sách đầy đủ các API ngăn chặn việc sử dụng bfcache mà là các API chặn bfcache trên các trang Cache-Control: no-store ngay cả khi các API này không được sử dụng tại thời điểm rời khỏi trang.
Thời gian chờ bfcache cho các trang Cache-Control: no-store cũng giảm xuống còn 3 phút (từ 10 phút đối với các trang không sử dụng Cache-Control: no-store) để giảm thiểu rủi ro hơn nữa.
Chọn không tham gia dành cho doanh nghiệp
Các doanh nghiệp thường có phần mềm và thiết bị dùng chung khó cập nhật. Bạn có thể tắt chính sách AllowBackForwardCacheForCacheControlNoStorePageEnabled để tiếp tục ngăn việc sử dụng bfcache cho các trang Cache-Control: no-store.
Kiểm thử thay đổi
Nhà phát triển có thể kiểm thử thay đổi này bằng cờ sau:
--enable-features=CacheControlNoStoreEnterBackForwardCache:level/restore-unless-cookie-change
Nếu có bất kỳ trường hợp ngoại lệ nào trước đó (ví dụ: cookie thay đổi), thì điều này sẽ ngăn trang sử dụng bfcache với lý do "Các trang có tài nguyên chính có Cache-Control: no-store không thể truy cập vào bộ nhớ đệm cho thao tác tiến/lùi" xuất hiện trong trình kiểm tra bfcache của Chrome DevTools.
Bạn có thể sử dụng trang kiểm thử bfcache này để kiểm thử có và không có cờ này.
Những điều nhà phát triển cần biết
Mặc dù nhà phát triển sẽ không cần thực hiện bất kỳ thay đổi nào để người dùng của họ hưởng lợi từ việc sử dụng bfcache lớn hơn này, nhưng có một số việc họ có thể cần phải xem xét do việc này. Đây là những điểm tương tự mà các trang web khác có thể đã gặp phải trong lần đầu ra mắt bfcache vào tháng 12 năm 2021.
Tác động đến hiệu suất
Lý do chúng tôi thực hiện thay đổi này là để cải thiện trải nghiệm trên trang cho người dùng trên web. Chúng tôi nhận thấy các chỉ số quan trọng về trang web được cải thiện đáng kể khi lần đầu tiên ra mắt bfcache. Giờ đây, chúng tôi muốn mang những điểm cải tiến đó đến nhiều trang web hơn.
Khi tính năng này ra mắt, chủ sở hữu trang web có thể thấy Chỉ số quan trọng chính của trang web được cải thiện và có thể đo lường mức sử dụng bfcache trong CrUX, bao gồm cả trong Trang tổng quan CrUX.
Số liệu phân tích về tác động
Các trang được khôi phục từ bfcache sẽ "khôi phục" trang cũ (bao gồm cả vùng nhớ khối xếp JavaScript) thay vì tải lại trang. Nhiều nhà cung cấp dịch vụ phân tích phổ biến không đo lường lượt khôi phục bfcache dưới dạng lượt xem trang mới vì họ chỉ kích hoạt lượt xem trang khi tải lần đầu.
Do đó, các trang web có thể thấy số lượt tải trang giảm trong số liệu phân tích khi bắt đầu sử dụng bfcache lần đầu tiên. Bạn nên xem những lượt này là lượt xem trang bằng cách đặt trình nghe cho sự kiện pageshow và kiểm tra thuộc tính persisted:
// Send a pageview when the page is first loaded.
gtag('event', 'page_view');
// Send another pageview if the page is restored from bfcache.
window.addEventListener('pageshow', (event) => {
if (event.persisted) {
// Page was restored from bfcache, sent another page view.
gtag('event', 'page_view');
}
});
Xử lý nội dung cập nhật khi khôi phục trang
Giờ đây, các trang web có thể thấy mức sử dụng bfcache khi trước đây không thấy mức sử dụng này và khi trang được tải lại hoàn toàn bằng dữ liệu mới, nên nhà phát triển có thể cân nhắc làm mới dữ liệu khi khôi phục bfcache.
Bạn có thể kích hoạt nội dung cập nhật theo cách tương tự như việc ghi lại các lượt xem trang khác cho việc phân tích bằng cách sử dụng sự kiện pageshow và kiểm tra tài sản persisted.
Xin lưu ý rằng không phải nội dung nào cũng cần được cập nhật và người dùng có thể muốn "quay lại" nội dung mà họ đã xem trước đó. Ví dụ: việc làm mới danh sách bài viết có thể có nghĩa là người dùng không còn nhìn thấy bài viết mà họ đã quay lại để xem nữa.
Tác động đến quảng cáo
Tương tự như tác động đến số liệu phân tích, các trang web có thể thấy số lượt hiển thị quảng cáo giảm nếu quảng cáo chỉ tải khi tải trang. Bạn có thể làm mới quảng cáo theo phương thức lập trình khi khôi phục bfcache để đảm bảo tính đồng nhất với việc tải toàn bộ trang, một lần nữa sử dụng sự kiện pageshow và kiểm tra thuộc tính persisted, nhưng đây không phải lúc nào cũng là việc nên làm. Hãy tham khảo tài liệu của nhà cung cấp quảng cáo về cách kích hoạt tải lại quảng cáo.
Thông tin khác về bfcache
Để biết thêm thông tin về bfcache, hãy xem hướng dẫn kỹ thuật toàn diện về bfcache.
Phản hồi
Chúng tôi rất mong nhận được ý kiến phản hồi về thay đổi này. Bạn có thể cung cấp ý kiến phản hồi trên công cụ theo dõi lỗi của Chrome sử dụng thành phần bfcache.
Kết luận
Chúng tôi rất vui khi có thể mang lại lợi ích của bfcache cho nhiều trang hơn để cải thiện trải nghiệm trang cho người dùng. Chúng tôi đã cân nhắc kỹ lưỡng về thay đổi này và sẽ triển khai theo cách an toàn nhất có thể. Chúng tôi hy vọng thông tin được cung cấp tại đây sẽ giúp nhà phát triển hiểu rõ về thay đổi này và thực hiện mọi thay đổi cần thiết để tránh gặp vấn đề khi điều này xảy ra.