为啥在浏览器缓存处理缓存时使用服务工作者进行缓存？

Posted 2023-02-15

【中文标题】为啥在浏览器缓存处理缓存时使用服务工作者进行缓存？

【英文标题】：Why use a service worker for caching when browser cache handles the caching?为什么在浏览器缓存处理缓存时使用服务工作者进行缓存？

【发布时间】：2016-08-23 07:13:05

【问题描述】：

我读到使用服务工作者进行离线缓存类似于浏览器缓存。如果是这样，那你为什么更喜欢服务工作者来进行缓存呢？浏览器缓存将检查文件是否被修改，然后从缓存中提供服务，并且通过服务工作者，我们从代码中处理相同的事情。默认情况下，浏览器具有该功能，那么为什么更喜欢 service worker？

【参考方案1】：

Service Worker 让您可以完全控制网络请求。您可以为 fetch 事件返回任何您想要的内容，它不需要是该特定文件的过去或当前内容。

但是，如果 HTTP 缓存可以满足您的需求，则您没有义务使用 Service Worker。

它们也用于推送通知等。

文档：https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API、https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers

【讨论】：

我支持“完全控制网络请求”。服务工作者可以做一些浏览器缓存不能做的事情，比如操纵标头和一个资源与另一个（例如，如果离线）。如果您只需要一个标准的浏览器缓存，那么没有理由将其重新实现为服务工作者——它不会变得更快或更容易使用。

同意这个答案，这里有两个额外的资源可以帮助我更好地理解浏览器的 http 缓存和服务工作者之间的关系。 “浏览器的 HTTP 缓存是您的第一道防线，但正如您所了解的，它仅在加载您之前访问过的版本化 URL 时才真正有效”（web.dev/service-workers-cache-storage）。 “Service Worker 最好作为一种增强而不是一种变通方法，所以与其对抗缓存，不如使用它！” (jakearchibald.com/2016/caching-best-practices)。

【参考方案2】：

我想分享我在阅读 Service Worker 文档并实施它时观察到的要点。

浏览器缓存不同，因为 Service Worker 支持离线缓存，所以即使网络不可用，webapp 也会访问缓存的内容。 Service Worker 将提供原生体验。 Service Worker 无法修改 DOM 内容，但仍可以在其范围内为页面提供服务。借助 postMessage 等事件，可以访问页面并更改 DOM。 Service Worker 不需要用户交互或网页。 它在后台运行。

【讨论】：

"Service Worker 将提供原生体验。"这是什么意思？

原生体验，提供丰富的离线体验、定期后台同步、推送通知

第 1 点也可以使用浏览器缓存。这取决于您的应用是如何被捆绑的......

【参考方案3】：

其实用 sw 代替 http 缓存响应请求比较慢... 因为sw使用cache api来存储缓存内容，确实比浏览器缓存慢——内存缓存和磁盘缓存。

它不是为比http缓存更快而设计的，但是，当您使用sw时，您可以完全自定义响应，我认为完全可自定义是您应该使用它的原因。

如果你的情况不够复杂，你不应该使用它