渐进式 Web 应用 (PWA) 简介

上周，我收到一份求职申请，询问我最喜欢的科技趋势。自然而然地，我去谷歌搜索了2019年的热门科技趋势，发现了一个相当有趣的列表。真正引起我注意的是渐进式Web应用程序（PWA）。这对我来说非常有趣，因为我最近一直在为一个移动应用项目扩展我的React Native知识，这似乎是一个比构建纯原生应用更令人愉悦的现代媒介。当然，有时你需要一个移动应用，但我更多的时候只是点击浏览器中的“关闭”弹窗。谁有时间下载一个应用，然后再删除它呢？

所以，本周我想讨论一下 PWA，以及为什么我认为它们如此酷，以及为什么你可能想要使用它！

什么是 PWA？

这种类型的应用程序由谷歌于2015年推出。它兼具网页和原生应用的特性，并取两者之长。它最初只面向安卓用户，但由于2018年3月iOS 11.3的更新，iPhone用户也开始享受它的乐趣。

特征

• 响应性：构建响应式应用程序是 2019 年的另一个趋势，因为需要为所有类型的屏幕和平台提供出色的用户体验
• 渐进式更新：诚然，它的名字就体现了这一点。但更重要的是，它需要渐进式更新，以便所有类型的用户都能与其应用进行交互。这一策略是 PWA 的核心，因此，最重要的内容会被推到最显眼的位置。
• 离线使用：这非常重要。这意味着用户无需使用浏览器即可使用此应用。这类应用即使在网络连接不佳甚至离线的情况下也能正常工作。
• 保持最新：由于服务人员的作用，应用程序打开并使用时会下载新的更新
• 安全：仅通过 HTTPS 提供服务，以保护其应用用户的隐私和安全
• 可发现：被搜索引擎收录并获得更好的排名
• 可安装且可链接：用户无需通过应用商店安装 PWA。这对开发者来说也非常有利，因为他们无需等待 Play 市场或 App Store 的批准。应用可以通过网页链接发送，并保存在主屏幕上。
• 推送通知：与 Web 应用程序相反，PWA 可以发送推送通知并弹出窗口提醒您有关好友请求、最新消息、新消息等。

简而言之：它的加载时间显著缩短，使用速度更快。它更易于分享，无需下载，这对用户来说非常有利。它的构建速度更快，因此成本更低，而且您无需等待批准即可在市场或商店上线。与网站相比，它提供卓越的用户体验，离线运行更安全，并且轻量级设计令人印象深刻。

好的例子

以下是一些已实施 PWA 的大公司的示例。

• Twitter：于 2017 年推出 PWA。自那时起，Twitter 将平均加载时间缩短了三分之一，跳出率降低了五分之一，并且每会话页面数指标提高了 65% 以上！
• 福布斯：同样在 2017 年推出了 PWA，旨在提升用户参与度并提供快速个性化的体验。PWA 的加载时间为 0.8 秒，每用户会话指标提升了 43%，参与度提升了 100%。
• Tinder：使用 React 和 Redux 构建。PWA 比之前的原生应用小 90%，加载时间不到原生应用的一半。等等。

这里有很多统计数据，但作为普遍共识，他们的 PWA 的运行时间只是以前的加载时间的一小部分，并且用户参与度呈指数级增长！

框架

构建 PWA 时，有几种不同的框架可供选择。Angular JS 和 Polymer 都是基于 JavaScript 的。此外，还有其他一些渐进式 Web 应用工具，例如 React、Lighthouse、Dev Tools 和 Workbox，它们都是构建健壮的渐进式 Web 应用的有效选择。

引擎盖下发生了什么？

我将在下一篇博客文章中深入探讨这个主题，深入探讨 Web 开发中构成 PWA 的不同元素。 下周我将涵盖以下内容：

• 应用外壳
• 服务工作者
• 清单文件
• 推送通知
• 安装横幅
• 不同的缓存策略