当前位置：网站首页>PWA 应用 Service Worker 缓存的一些可选策略和使用场景

PWA 应用 Service Worker 缓存的一些可选策略和使用场景

2022-08-08 10:02:00 【InfoQ】

SAP 电商云 Spartacus UI 提供了将站点作为 PWA 运行的功能。这提高了用户性能，改善了用户体验，因为它添加了另一个缓存层，并减少了服务器端渲染 (SSR) 服务的负载。

PWA 的工作方式是，对于定义的应用程序文件列表，它会根据文件的内容生成文件哈希。此哈希用于在客户端浏览器中决定文件是否已更改。比如重新部署的情况下，这些文件应该重新加载。

Network only：内容必须始终是最新的，适用于电商的付款和结帐，余额报表等场景。

Network falling back to cache：优先提供最新的内容。但是，如果网络出现故障或不稳定，则可以提供稍旧的内容。适用场景有及时的数据，价格和费率（需要免责声明），订单状态等。

Stale-while-revalidate：可以立即提供缓存内容，但以后应该使用更新的缓存内容。适用场景有新闻提要，产品列表页面，留言等。

Cache first, fall back to network：内容是非关键的，可以从缓存中提供以提高性能，但 Service Worker 应偶尔检查更新。适用于 App shells 和 Common resources.

Cache only: 适用于内容极少发生变化的静态资源。

下面是 SAP 电商云 Spartacus UI ngsw-config.json 文件的内容：

{
 &quot;index&quot;: &quot;/index.html&quot;,
 &quot;assetGroups&quot;: [
 {
 &quot;name&quot;: &quot;app&quot;,
 &quot;installMode&quot;: &quot;prefetch&quot;,
 &quot;resources&quot;: {
 &quot;files&quot;: [
 &quot;/favicon.ico&quot;,
 &quot;/index.html&quot;,
 &quot;/*.css&quot;,
 &quot;/*.js&quot;,
 &quot;/manifest.webmanifest&quot;
 ]
 }
 }
 ],
 &quot;dataGroups&quot;: [
 {
 &quot;name&quot;: &quot;basesites&quot;,
 &quot;urls&quot;: [
 &quot;*/basesites?fields=baseSites\\(uid,defaultLanguage\\(isocode\\),urlEncodingAttributes,urlPatterns,stores\\(currencies\\(isocode\\),defaultCurrency\\(isocode\\),languages\\(isocode\\),defaultLanguage\\(isocode\\)\\),theme,defaultPreviewCatalogId,defaultPreviewCategoryCode,defaultPreviewProductCode\\)*&quot;
 ],
 &quot;cacheConfig&quot;: {
 &quot;maxSize&quot;: 1,
 &quot;maxAge&quot;: &quot;1d&quot;,
 &quot;strategy&quot;: &quot;performance&quot;
 }
 }
 ]
}