渐进式 Web 应用 (PWA)：类似原生的 Web 体验

渐进式 Web 应用：感觉像应用的网站

渐进式 Web 应用 (PWA) 是一种行为类似原生移动应用的网站。它可以安装到手机主屏幕、离线工作、发送推送通知以及访问设备功能——所有这些都无需通过应用商店。PWA 结合了网站和原生应用的优点。

是什么让一个网站成为 PWA

三个要素使一个网站成为渐进式 Web 应用。首先，它必须通过 HTTPS 提供服务以确保安全。其次，它需要一个 Service Worker——一个在后台运行的 JavaScript 文件，拦截网络请求并缓存资源，使应用能够离线工作。第三，它需要一个 Web 应用清单——一个 JSON 文件，告诉浏览器应用安装后的外观：名称、图标、启动画面和显示模式。

当这些要求满足时，浏览器会提示用户安装 PWA。在 Android 上，它显示为全屏应用，没有浏览器界面。在桌面上，它会在自己的窗口中打开。这种体验几乎与原生应用无异。

离线体验

Service Worker 是 PWA 的核心。它可以在用户首次访问时缓存应用的文件，因此后续访问即使没有互联网连接也能立即加载。您可以定义不同的策略：静态资源使用缓存优先，动态内容使用网络优先，或者使用 stale-while-revalidate 来平衡速度和新鲜度。

这意味着即使用户在飞机上、隧道中或连接不稳定时，PWA 也能显示有意义的内容。当连接恢复时，Service Worker 可以在后台同步任何待处理的数据。

推送通知

与原生应用一样，PWA 可以发送推送通知以重新吸引用户。推送通知 API 结合使用 Service Worker 和推送服务。服务器将推送消息发送到推送服务，推送服务将其传递给浏览器。Service Worker 被唤醒，处理通知并显示它——即使网站没有打开。

何时构建 PWA

PWA 非常适合内容驱动的网站、新闻应用、电子商务商店以及任何用户体验受益于离线访问和快速加载的应用。它们比原生应用开发和维护成本更低，并且不需要应用商店批准。主要限制是它们无法完全访问设备硬件——与原生应用相比，蓝牙、NFC 或高级文件系统访问等功能仍然受限。

许多公司通过 PWA 取得了令人印象深刻的结果。Twitter Lite 的每次会话页面数增加了 65%，发送的推文数增加了 75%。Pinterest 将其移动网站重建为 PWA，参与度提高了 60%。这些结果表明，PWA 不仅仅是一种折衷方案——在许多用例中，它们可能比原生应用更好。