如何用WORKBOX测试预缓存？

如何知道我们的网站是否使用缓存存储中的资产？ 一旦我们将资产存储在高速缓存中。在我们更改最新资产的版本之前，网站会一直使用这些资产吗？

---

解决方案

您可以使用浏览器的开发人员工具来验证网络请求的情况。

• Chrome
• Firefox
• Safari

官方文档有各种主题帮助调试和配置工作箱缓存：

• Common recipes
• Troubleshoot and Debug

捕获DevTools控制台，显示Workbox正在执行的操作(在调试模式下配置时)：

捕获DevTools网络选项卡：

上图的一些额外信息：

• 齿轮(红色方块)表示ServiceWorker执行了对指定资源的请求(通过fetch，XMLHttpRequest)。
• 如果大小列(紫色正方形)没有显示数字大小，则表示请求是从缓存(可以是内存缓存、磁盘缓存、应用程序缓存...)提供的。