什么是 PWA?
当谷歌提出 PWA 时,并没有一个精确的定义。它不是一种特定的技术,而是一种组合技术,旨在改善用户体验。这些技术包括 Web 应用清单、服务工作者、网络推送等。
PWA 的主要特性如下:
- 可靠性 - 即使在不稳定或断开的网络环境中也能快速加载。
- 用户体验 - 响应迅速,具有流畅的过渡动画和用户操作反馈。
- 粘性 - 像原生应用一样,可以添加到主屏幕并接收离线通知。
PWA 本身在两个方面强调了 渐进性。
- PWA 仍在不断发展;
- PWA 向下兼容且不具侵入性。开发者使用新特性几乎没有成本 - 开发者可以逐步将其添加到现有网站中。
谷歌的 "渐进式网络应用检查表" 定义了 PWA 的最低要求。
- 通过 HTTPS 提供服务。
- 页面在桌面、平板和移动设备上应具有响应性。
- 所有 URL 在断开连接时应有内容显示,而不是默认的浏览器页面。
- 需要将 Web 应用清单添加到桌面。
- 页面加载更快,延迟更短,即使在 3G 网络上。
- 在所有主要浏览器中正确显示。
- 流畅的动画和即时反馈。
- 每个页面都有自己的 URL。
PWA 的特性
PWA 结合了网络应用和原生应用的优点,给我们带来了以下特性。
- 渐进性 - 适用于所有浏览器,因为它是在考虑渐进增强的情况下开发的。
- 连接无关 - 能够利用服务工作者实现离线或低网络连接。
- 原生体验 - 基于应用外壳模型,应该具有原生应用的交互。
- 持续更新 - 始终保持最新,没有版本或更新问题。
- 安全性 - 通过 HTTPS 提供服务。
- 可索引 - 清单文件和服务工作者可以被搜索引擎识别和索引。
- 粘性 - 通过推送离线通知等,可以让用户回到您的应用中。
- 可安装 - 用户可以轻松将网络应用添加到主屏幕或桌面,而无需前往应用商店。
- 可链接 - 通过链接分享内容,无需下载和安装。
更具体地说,PWA 相较于原生应用的优势是什么?开放性和可索引性。用户几乎无法即时安装原生应用,也无法无缝搜索原生应用。
下表展示了传统网络应用、原生应用和 PWA 在各个特性上的比较。
可安装 | 可链接 | 用户体验 | 用户粘性 | |
---|---|---|---|---|
传统网络应用 | ❌ | ✅ | ❌ | ❌ |
原生应用 | ✅ | 😐 | ✅️ | ✅ |
PWA | ✅ | ✅ | ✅ | ✅ |