共计 2907 个字符，预计需要花费 8 分钟才能阅读完成。
渐进式 WebApp，在很多公司的倒退蓝图上，紧跟古代浏览器的脚步，以适应用户预期。像所有新的概念和技术性能一样，它们会产生问题：这是不是我的客户须要的？它会如何晋升我的业务？技术可行性怎么样？
为了制订一些数字化的策略，须要几个利益相关者参加：产品经理、CTO，UX 调研人员。产品经理关怀每一个性能的业务价值，CTO 关怀技术的可行性和可靠性，UX 调研人员关怀性能是否能够解决客户问题。
这篇文章旨在答复以上三个人的问题，并构建 PWA 利用。你能够从你的客户需要开始，转换成 PWA 的性能，聚焦于掂量每一个性能带来的业务价值。
PWA 解决客户需要
Google 有一个规定：“focus on the user and all else will follow”。思考用户优先：客户须要什么？PWA 能够给他们提供什么？
在做用户调研的时候，咱们发现了一些乏味的模式：
- 用户厌恶手机上关上网页提早和不牢靠。
- 50% 的智能手机用户更喜爱在网页下来浏览或者购物，不想下载 App。
- 卸载 App 的其中一个大的理由是手机存储空间无限（PWA 个别只须要 1M 不到）。
- 应用手机网页购物的智能手机用户，85% 的人感觉手机告诉有用。
综上所述，咱们会发现客户更喜爱的体验是：疾速、可装置、牢靠、密切联系。
PWA 利用古代 Web 性能
PWA 提供了一系列绝佳的体验和古代 Web API，旨在满足你的客户需要。
举个例子，用 service worker，能够缓存你的资源文件，也能够预测性的 prefetch，让你的站点更快更牢靠。Manifest API，让你的站点变得可装置，用户能够从首屏间接点击图标启动你的 PWA 利用。Notification API 则能够给你的客户发告诉信息，让分割更加亲密。
了解业务影响
业务的胜利的定义能够是很多方面：
- 用户破费更多的工夫在你的服务上
- 潜在客户的跳出率的升高
- 转化率的晋升
- 更多回头客
大部分 PWA 的我的项目都有很高的转化率。取决于你的指标，你能够优先选择局部 PWA 的性能，让你的业务更好。PWA 的性能能够独立的去利用。
一个关上速度快的网站的业务影响
首先统计你的网站以后的转化率以及支出，而后依据 core web vitals 的相干指标去优化你的站点，再察看每日转化率和支出的变动。
ebay 通过一系列对网站的优化，得出了一个他们的论断，每 100ms 的速度晋升，能够带来 0.5% 的下单量的晋升。
一个可装置的 web 站点的业务影响
为什么你心愿用户装置你的 PWA 利用？为了让他们更容易回到你的站点。一个安卓 App 的装置大抵有三个步骤：先去利用市场搜寻 App，下载，装置 App。一个 PWA 的 App 的装置就很简略，间接点击一个按钮即可，用户无需来到以后会话。
一旦装置了，用户只需点击桌面的图标即可启动，App 之间的切换也和原生统一，零碎的搜寻也能够搜到。关上的界面也无需放心会有浏览器的地址栏之类的，能够采纳 standalone 的形式启动，与原生利用一样。
违心装置 PWA 的用户，个别都是你的深度用户，他们会花更多的工夫在这个下面，也会常常应用。
为了让你的 PWA 可装置，须要达到一些条件，当这些条件满足了之后，你能够提醒用户装置，在不同的平台上做不同的提醒，如下图所示：
一旦你开始提醒用户装置，你就须要去设置一些埋点统计，看看多少人装置了，这些装置的用户又是如何应用的。
为了让更多的用户装置，你可能会尝试不同的文案或者款式。
为了了解用户从哪里来到的，改善用户留存，安装程序能够退出以下四个指标：
- 有资格装置的用户数（满足了可装置的条件）
- 点击装置提醒的用户数
- 点击了接管或者回绝的用户数
- 胜利装置的用户数
你能够采取更审慎的做法，刚开始只给一小部分用户去提醒装置。
一段时间过后，你能够收集到很多统计数据，这样就能剖析出从图标点击关上网站的用户是如何操作的，这批用户是否更深度应用了？是否转化率晋升了？
为了晓得哪些用户装置了，你能够去监听 appinstalled 的事件。也能够用 js api 去检测以后是否是 standalone 窗口（这表明是从桌面图标关上的）。而后用这些数据做更具体的剖析。
装置是一个十分棒的形式，让用户能够回到你的站点，晋升用户的忠诚度。你也能够给这些用户提供一些个性化的体验。
即便你曾经有了原生 APP，你也能够去尝试 PWA 的形式，先提醒用户装置原生 APP，如果用户不违心去下载，再提醒装置 PWA 的版本。有这样一部分用户属于中等深度用户，不心愿去下载一个原生 App，更能承受 PWA 这种只在桌面减少一个图标，更加轻量。
一个牢靠的网站的业务影响
如果一个游戏能够提供离线模式，那么用户玩的频率会更高一些。网络的可靠性是一个很大的机会，特地是对于一些网速较慢的国家，比方印度。如果你的 App 反对离线，或者低速网络失常应用，受众会更广。
当你去关上一个从利用市场下载的 APP，你更期待它不须要联网就能失常关上和应用。PWA 的利用也是一样的。
至多，提醒用户网络连接已断开，也比一个空白页面要好很多。很多事实场景，即便没有网络也心愿能够失常应用，比方：登机牌，购物车等。
当你曾经施行了离线的计划，你能够去统计看看多少用户是离线应用的，这些用户是否始终停留着直到网络复原。
一个密切交互的网站的业务影响
推送告诉能够让用户实时的理解到最新的音讯，也能够蕴含一些个性化的内容。
须要留神的是，不要一上来就让用户注册，仅仅为了收音讯告诉，等用户体验过之后，在适合的机会去提醒用户。告诉的内容也有肯定考究，尽可能的是用户最心愿看到的，比方截止工夫，火车票行程等。
为了统计推送告诉的有效性，能够定制以下指标：
- 有资格取得推送告诉的用户数
- 点了告诉提醒的用户数
- 受权推送告诉权限的用户数
- 回绝推送告诉的用户数
- 参加推送告诉的用户数
- 从推送告诉带来的用户的转化率
PWA 中的 P 的含意：渐进式启动，一一性能减少
PWA 是古代的站点，受害于浏览器的反对，联合了用户最爱的原生 APP 的诸多个性，它利用了一系列的最佳体验和古代 Web Api，能够独自的集成和施行，依据你的业务来排优先级。
为了放慢网站的现代化进度，让它成为一个真正的 PWA 利用，能够尝试一一性能去减少。首先要去找到你的用户感觉价值最大的性能，把这些信息给到设计师和开发者，最初不要忘了去统计一下你的 PWA 赚了多少额定的钱。
总结
从 Chrome 的版本更新，咱们能够看到很显著的趋势，谷歌曾经开始在 PWA 高低狠手了，以前没有一个显著的装置按钮，当初间接放在了导航栏右侧。在应用 PWA 之前，先理解它对业务的影响至关重要，这样能力明确你是否须要应用它。与小程序不同，各家都是不同的规范，PWA 的规范齐全由 W3C 定制。而且它也不依赖微信或者支付宝这种环境，每个手机都有浏览器，那就能够去装置 PWA 的利用。作为一个平台，微信和支付宝都没有能力跟上 web 规范的定制，浏览器的更新永远是走在最后面，而且 PWA 也能够在微信和支付宝中运行，惟一的缺点在于 ios 的 webview 目前还不反对 service worker，无奈做到离线，置信也就是这几年的事件了，苹果也在推动这一块，尽早的将你的站点扭转成 PWA 的利用更能适应将来的环境。
参考
https://web.dev/drive-busines…
