跳转到文章
Performance2026年10月20日阅读约 1 分钟

bfcache 检查清单:后退导航与页面状态

按可复现的导航步骤测试前进/后退缓存,排查报告中的阻碍原因,并检查返回后页面状态是否正确。

返回箭头指向保存在透明内存舱中的页面

如果后退时整个页面都会重新加载,可以检查前进/后退缓存(bfcache)。有效的测试需要具体的导航步骤和已知的初始状态。一次测试成功,并不意味着以后每次返回都能恢复页面。

确定导航步骤

选择一个公开的商品页或文章页,从该页面进入另一页面,再使用浏览器的“后退”按钮返回。记录浏览器、版本及所用页面,并检查返回后的筛选条件、滚动位置和可见内容是否仍然正确。

Milten 的 bfcache 测试有助于检查页面恢复情况。请确认测试结果涵盖哪些导航步骤:手动采用不同的路径,可能会得到不同的结果。

在浏览器中查看结果

Chrome DevTools 的 Application 面板提供了前进/后退缓存测试。它会显示测试结果,以及报告中阻碍页面恢复的原因。解读结果时,请以所测试的浏览器及版本为准。

bfcache 与 HTTP 缓存是不同的机制。bfcache 指南介绍了两者的区别,该指南由 web.dev 提供。仅凭网络请求变快,无法证明页面是从 bfcache 恢复的。

排查报告中的原因

下面是一个不涉及客户数据的说明性示例:诊断工具报告某个引入脚本中的生命周期事件处理程序阻碍了恢复。找到对应脚本,确认处理程序的用途,在非公开测试环境中验证适当的修改,然后按相同的导航步骤重新测试。

不要仅为了通过测试就一概修改缓存响应头。应考虑页面的用途,以及对信息时效性和机密性的要求。bfcache 的使用条件也会因浏览器而异。

检查返回后的页面状态

修改后,不仅要看技术测试结果,还要检查页面内容。如果页面包含价格、购物车或会话信息,请确认这些信息正确。恢复后的页面不应显示可能误导用户的过时信息。

在受众实际使用的浏览器中重复测试,并分别记录成功、失败和未执行的测试。如果返回后的交互响应缓慢,请参阅 INP 指南。

能否保证每次都强制恢复?

是否使用缓存由浏览器决定。测试成功只说明在该次测试中观察到了页面恢复。

是否应该取消所有缓存限制?

应先检查报告中的原因,以及设置该限制的目的。评估修改时,还要考虑保护要求和显示内容的准确性。

测试页面的 bfcache。要检查初次加载,请使用速度测试。

网站速度检测

找出拖慢网站速度的原因

使用 Milten 检测页面,查看 Core Web Vitals 指标并获取加快加载速度的建议。

检测网站
Cookies

我们使用 Cookie

我们使用 Cookie 以在你的网站上为你提供更好的体验。你可以在我们的 隐私政策.

bfcache 检查清单:后退导航与页面状态