我很欣赏这个问题，可能只是基于“观点”的问题，但是，我认为，笼统的答案可能会对将来有兴趣进一步了解PWA和服务人员的其他人有所帮助。

背景

我已经在网上搜索了，很惊讶地发现没有最佳做法的清晰描述，因为它涉及选择服务工作者为PWA预先缓存的文件。

有各种文章/文档概述了预缓存的功能以及其工作方式（请参阅此处以获取更多信息），但是它们都没有提供“常见做法”的示例。

题

在标准的渐进式Web应用程序中，通常会预缓存哪些文件？

我目前在做什么...

为了确保我的应用程序尽可能在离线状态下运行，我预缓存了以下所有文件：

• 该index.html模板（我的应用程序是一个Vue的SPA）
• 所有JS文件（包括来自动态导入的JS）
• 所有CSS文件（只有一个）
• 网络清单
• 应用程序使用的任何自定义字体
• 任何必需的语言文件（这是动态的，即只会预缓存当前访问者的语言）
• 所有应用程序图标（请参阅下面的列表）
• 所有初始屏幕（请参阅下面的列表）

就我而言，这大约为2MB（应用程序完成后可能会增加）

应用图标分类

• android-chrome-192x192.png
• android-chrome-512x512.png
• apple-touch-icon-120x120-precomposed.png
• apple-touch-icon-120x120.png
• apple-touch-icon-180x180-precomposed.png
• apple-touch-icon-180x180.png
• apple-touch-icon-72x72-precomposed.png
• apple-touch-icon-72x72.png
• apple-touch-icon-precomposed.png
• apple-touch-icon.png
• icon_128x128.png
• icon_144x144.png
• icon_152x152.png
• icon_192x192.png
• icon_384x384.png
• icon_512x512.png
• icon_72x72.png
• icon_96x96.png
• favicon-16x16.png
• favicon-194x194.png
• favicon-32x32.png
• favicon.ico
• mstile-144x144.png
• 野生动物园固定tab.svg

开机画面分类

• splash-1125x2436.png
• splash-1242x2148.png
• splash-1536x2048.png
• splash-1668x2224.png
• splash-2048x2732.png
• splash-640x1136.png
• splash-750x1294.png