3

我在看 service worker practice 和workbox。

有很多文章谈论预缓存，workbox 甚至为此提供了特殊的方法precachingAndRoute()。我想我理解预缓存和运行时缓存之间的概念差异，但让我感到困惑的是为什么要如此特殊地对待预缓存？

我读过的所有关于预缓存的文章都强调了它如何在客户端离线时使 Web 应用程序可用。这不是缓存（即使它不是预缓存）的用途吗？我的意思是，如果配置正确，运行时缓存似乎也可以实现这一点。是否必须预先缓存才能使 Web 应用程序离线工作？

唯一明显的区别是何时创建缓存。那么，如果客户端离线，无论是预缓存还是运行时缓存，都无法创建缓存，如果在客户端在线时的最后一次访问期间创建了缓存，那么对于当前访问响应的缓存有什么关系呢？预缓存还是运行时缓存？

考虑 2 个抽象案例进行比较。假设我们有两个不同的服务工作者，一个 ( /precache/sw.js) 只做预缓存，另一个 ( /runtime/sw.js) 只做运行时缓存，其中/precache托管/runtime相同的 Web 应用程序（意味着要缓存相同的资产）。

在什么情况下，由于不同的 sw 设置，Web 应用程序可能会以不同的方式/precache运行？/runtime

在我的理解中，

  • 如果无法创建缓存（例如第一次访问时离线），那么预缓存和运行时缓存应该没有什么不同。
  • 如果可以成功创建预缓存（即客户端在第一次访问时在线），则运行时缓存也应该如此。（让我们不要过于疯狂，例如客户可能仅在某个特定时刻在线，在我的示例中它们仍然应该是相同的。）
  • 如果缓存可用，则预缓存和运行时缓存无关，因此仍然相同。

当 precache 显示优势时，我能想到的唯一场景是，当缓存需要在当前访问时更新时，precache 确保当前访问获得最新信息。如果是这种情况，NetworkFirst 运行时缓存不会做同样的事情吗？而且，与“离线”无关，我读过的几乎每一篇关于 sw 预缓存的文章都会提到。

在线/离线如何使预缓存成为英雄？

我在这里错过了什么，预缓存有什么特别之处？

4

2 回答 2

2

首先，您的并排服务人员仅限于这些文件夹或路径。所以他们彼此隔离。其次，您应该为您的应用程序定义一个缓存策略，该策略混合了 preCached 资产以及动态加上失效例程/逻辑。

您希望在不破坏应用程序的任何动态特性的情况下尽可能多地进行预缓存。所以缓存常用的 JS、CSS、图像、字体和反复使用的页面。当然有一个失效策略来保持这些最新。接下来处理来自 fetch 事件处理程序的非缓存网络可寻址资源 (URL)。在有意义的时候缓存它们。并使缓存的资产无效，因为它是有意义的。

对于某些应用程序，我会缓存整个内容。它们通常比较小，例如几十到几百页。对于像亚马逊这样的网站，我永远不会这样做 LOL。无论缓存了多少，我总是有一个对应用程序/站点有意义的失效和更新策略。

于 2020-10-03T12:21:16.577 回答
1

一种不同的情况可能如下。

该应用程序是什么样的：

您的应用程序有一个登录页面。您有一些可以导航到的路线

缓存策略：

如果用户访问着陆页，则只有着陆页资产会被缓存。

预缓存策略：

如果用户进入登录页面，所有配置的预缓存资产都将被缓存。

区别：

因此，如果用户只进入登录页面，然后又下线，则预缓存策略将允许他们以某种方式导航并与您的应用程序的其他路由交互，而缓存策略将不允许任何导航到其他路线。

于 2021-07-06T17:36:03.767 回答