版本：v8

构建渐进式 Web 应用

Capacitor 对渐进式 Web 应用拥有一流支持，使得构建一个在 iOS 和 Android 上原生运行，同时在 Web 上作为移动 Web 应用或"渐进式 Web 应用"运行的应用变得容易。

什么是渐进式 Web 应用？

简单来说，渐进式 Web 应用（PWA）是一种利用现代 Web 能力为用户提供类似原生应用体验的 Web 应用。这些应用部署在传统的 Web 服务器上，可通过 URL 访问，并且可以被搜索引擎索引。

渐进式 Web 应用实际上只是针对移动性能进行了优化，并利用新可用的 Web API 来提供与传统原生应用类似的功能（如推送通知和离线存储）的网站的另一种说法。

Capacitor 对渐进式 Web 应用和原生应用都提供了一流支持。这意味着 Capacitor 的桥接层支持在原生环境或 Web 环境中运行，许多插件在 这两种环境 中都可用，并具有完全相同的 API 和调用约定。

这意味着你可以将 @capacitor/core 和 Capacitor 插件作为原生应用和渐进式 Web 应用的依赖项使用，Capacitor 会在需要时无缝调用 Web 代码，在可用时调用原生代码。

此外，Capacitor 还提供了许多用于查询当前平台的实用工具，以便在原生环境或 Web 上运行时提供定制化的体验。

渐进式 Web 应用应该拥有应用清单（App Manifest）和 Service Worker。

首先，你需要一个应用清单文件（manifest.json），该文件与你的 index.html 文件放在一起，提供关于应用的元数据，例如名称、主题颜色和图标。例如，当你的应用安装到主屏幕时，将使用这些信息。

接下来，为了发送推送通知和离线存储数据，Service Worker 将使你的 Web 应用能够代理网络请求并执行处理和同步数据所需的后台任务。

Service Worker 功能强大但复杂。通常，不建议从头开始编写它们。相反，可以看看像 Workbox 这样的工具，它提供了常见的 Service Worker 方案，你可以轻松地将其整合到应用中。

在 MDN 的使用 Service Worker 页面上阅读更多关于使用 Service Worker 的信息，包括如何注册它们。

渐进式 Web 应用通过几个性能标准来评判，包括可交互时间和首次有效绘制。

在上线之前，请遵循渐进式 Web 应用清单，并使用 Lighthouse 来审核和测试你的应用。

如果你在使用现有前端技术栈时难以达到渐进式 Web 应用性能标准，可以看看 Ionic Framework，它是几乎零配置就能快速获得 PWA 支持的一个选择。