PWA 何时以及如何自我更新？
When and how does a PWA update itself?
据我所知，一旦您在 PWA 的网站上单击 "add to homescreen"，浏览器就会使用提供的清单文件和源代码生成一个 .apk，并像普通应用程序一样安装它。
我注意到当我更新网站时，应用程序也会显示更新的内容，这表明该应用程序只是访问网站的包装器。我还注意到网站的更新不会立即显示，我认为这是由于内部缓存。
我的问题是，我的假设是否正确？或者更一般地说，PWA 何时以及如何更新，有没有办法在客户端机器上强制更新？
无缓存场景（无 Service worker）：只有当您使用 Service worker 时，您的 PWA 应用才会被缓存。 Manifest.json 将帮助您将网络应用程序添加到带有图标的主屏幕，并且无需地址栏即可打开。如果您没有 Service Worker 或者您的浏览器不支持它，网页将每次都重新加载。没有缓存。
Cache-On 场景（有 Service Worker）： 假设你配置了 Service Worker，Service Worker 可以通过延迟加载或预取配置缓存的文件来缓存（您可以包括或排除从 html、CSS、图像到 JSON/XML API 响应的缓存任何内容）。
初始缓存后，Service Worker 将根据您从以下实施的 cache approach 使用缓存来为您的应用程序网络请求提供服务。
- 缓存回落到网络
- 网络回退到缓存
- 缓存然后网络
由于性能优势，大多数应用选择 precache 并在加载时查找新文件，如果发现任何更改，将在下一个会话中加载或提示用户刷新。使用这个解决方案，每个文件都会有一个很长的 Hash 字符串，用于 service worker 缓存的每个文件。在加载每个应用程序时，将从服务器获取哈希码以匹配并找到需要更新的文件，并将在单独的服务工作线程中更新相同的文件。您可以在 chrome 开发人员工具中的网络选项卡 -> 服务工作者响应中注意到这一点。
如果您选择 network-first 方法，您可以避免在初始加载时显示旧内容，但会失去缓存带来的显着性能优势。
只有两个事件…
本质上，只有两个事件会自动触发 PWA 更新：
- 链接中的变化
manifest.json；例如更改的图标文件或更改的 scope 或 start_url.
- 控制中的一个字符更改
service-worker.js。因此，如果您将版本号存储在此文件的 const 中并更改它，将触发 PWA 的更新。
当检测到更改时，新版本通常只会在下一次 PWA 加载时激活。因此，总的来说，需要 两次重新加载 才能看到变化。
最终如何处理更新，最终由 service-worker.js 决定。可以根据 PWA 资产的大小和波动性来定义不同的更新策略。也可以立即激活新服务。
但是，有一个重要警告。确保浏览器缓存过期指令由.htaccess文件设置您的资产服务器的持续时间设置为非常短（例如 hours）甚至 。
如果不这样做，将导致浏览器在 manifest.json 或 service-worker.js.
的几天内看不到任何变化
有关 service worker 行为的更多详细信息可从 Google Web Fundamentals 获得。
据我所知，一旦您在 PWA 的网站上单击 "add to homescreen"，浏览器就会使用提供的清单文件和源代码生成一个 .apk，并像普通应用程序一样安装它。
我注意到当我更新网站时，应用程序也会显示更新的内容，这表明该应用程序只是访问网站的包装器。我还注意到网站的更新不会立即显示，我认为这是由于内部缓存。
我的问题是，我的假设是否正确？或者更一般地说，PWA 何时以及如何更新，有没有办法在客户端机器上强制更新？
无缓存场景（无 Service worker）：只有当您使用 Service worker 时，您的 PWA 应用才会被缓存。 Manifest.json 将帮助您将网络应用程序添加到带有图标的主屏幕，并且无需地址栏即可打开。如果您没有 Service Worker 或者您的浏览器不支持它，网页将每次都重新加载。没有缓存。
Cache-On 场景（有 Service Worker）： 假设你配置了 Service Worker，Service Worker 可以通过延迟加载或预取配置缓存的文件来缓存（您可以包括或排除从 html、CSS、图像到 JSON/XML API 响应的缓存任何内容）。
初始缓存后，Service Worker 将根据您从以下实施的 cache approach 使用缓存来为您的应用程序网络请求提供服务。
- 缓存回落到网络
- 网络回退到缓存
- 缓存然后网络
由于性能优势，大多数应用选择 precache 并在加载时查找新文件，如果发现任何更改，将在下一个会话中加载或提示用户刷新。使用这个解决方案，每个文件都会有一个很长的 Hash 字符串，用于 service worker 缓存的每个文件。在加载每个应用程序时，将从服务器获取哈希码以匹配并找到需要更新的文件，并将在单独的服务工作线程中更新相同的文件。您可以在 chrome 开发人员工具中的网络选项卡 -> 服务工作者响应中注意到这一点。
如果您选择 network-first 方法，您可以避免在初始加载时显示旧内容，但会失去缓存带来的显着性能优势。
只有两个事件…
本质上，只有两个事件会自动触发 PWA 更新：
- 链接中的变化
manifest.json；例如更改的图标文件或更改的scope或start_url. - 控制中的一个字符更改
service-worker.js。因此，如果您将版本号存储在此文件的const中并更改它，将触发 PWA 的更新。
当检测到更改时，新版本通常只会在下一次 PWA 加载时激活。因此，总的来说，需要 两次重新加载 才能看到变化。
最终如何处理更新，最终由 service-worker.js 决定。可以根据 PWA 资产的大小和波动性来定义不同的更新策略。也可以立即激活新服务。
但是，有一个重要警告。确保浏览器缓存过期指令由.htaccess文件设置您的资产服务器的持续时间设置为非常短（例如 hours）甚至 manifest.json 或 service-worker.js.
有关 service worker 行为的更多详细信息可从 Google Web Fundamentals 获得。