不过，说真的，什么是渐进式 Web 应用？

我对“渐进式 Web 应用”（PWA）的概念已经熟悉一段时间了。但内心深处一直对它怀有渴望。

我参加过各种会议和聚会，听过关于这个主题的演讲。我读过主要的文档和关于“什么是 PWA”的顶级文章。我还读过 Alex Russell 的文章“渐进式 Web 应用：摆脱标签页束缚，却不失灵魂” [发布于 2015 年 6 月 15 日]，其中讲述了他和 Frances Berriman 之间关于“渐进式 Web 应用”一词起源的讨论；还有 Frances 的文章“命名渐进式 Web 应用” [发布于 2017 年 6 月 26 日]，其中探讨了“渐进式 Web 应用”一词本身的语义含义。

然而，我发现很难（基于具体的引用）给出最终、准确、简洁的定义。我在互联网上也看到了类似的困惑。

其中一个例子是 dev.to的Ben Halpern，他在一篇名为“渐进式 Web 应用到底是什么？说真的。 ”的文章中写道 [发布于 2017 年 11 月 6 日，更新于 2018 年 4 月 21 日]：

今天早上，我本来想写一篇文章，概述一些关于实现渐进式 Web 应用 (PWA) 的技巧。但当我开始介绍这个主题时，我又遇到了最初最难的部分：我很难描述什么 是 渐进式 Web 应用。

他也捕捉到了很多我的“只有我才有这种感觉吗？”的感觉：

也许 PWA 的初衷是包容许多技术方法，所以它们需要比较模糊。如果只是源文档这样，或许还好，但我觉得网络上散布的其他介绍和指南都使用了这种模糊的语言，导致混乱的情况激增。

在社交场合说“等等，我完全不懂”是很困难的，因为你不知道是不是所有人都懂，而你才是那个傻瓜。在 PWA 领域，我确实觉得很多人点头附和，以为其他人都懂 PWA 是什么，而他们肯定忽略了什么。你懂的，冒名顶替综合症。 [强调]

另一个这样的例子是微软在这篇博文中承认的不确定性[发布于 2018 年 2 月 6 日]——在谷歌搜索“什么是渐进式网络”时，这篇文章排在首页首位：

开发者社区对 PWA 的热情几乎是显而易见的——但 在所有这些热情之中，很难确定一个关于“渐进式 Web 应用”的单一、简洁、权威的定义。 [强调]

就我个人而言，尤其让我感到困惑的是，互联网上似乎已经围绕着构成渐进式 Web 应用的三个基本要求达成了共识——但却没有一个提到它的出处。在没有任何引用的情况下，竟然能达到这种非官方的、广泛的共识，这对我来说令人印象深刻——它只是在互联网上引起了共鸣。（最糟糕的是？我感到内疚；我在“基于浏览器的开源替代通信工具” [发布于 2018 年 3 月 14 日] 中也做过同样的事情。我记得当时我对此感到很矛盾。）

因为这次我无法让自己摆脱这个精神困境，所以我开始研究：

1. 构成 PWA 的属性列表的来源通常在文档和帖子中引用，
2. 文档和帖子中通常会引用 PWA 的三个基本要求的来源，以及
3. “渐进式 Web 应用”顶级搜索结果中定义的差异

最后，我将发布我对 PWA 定义的结论（无论其价值如何）。

构成 PWA 的一般属性

这部分是结论性的。2015 年，Alex Russell在网上提出了“渐进式 Web 应用”这个术语。他讲述了他和Frances Berriman之间的一次对话，在对话中，他们基于现代浏览器的渐进式、强大的演进，“列举了一类新型应用程序的属性”。这些属性逐字逐句如下：

• 响应式：适合任何外形尺寸
• 独立连接：通过 Service Worker 逐步增强，使其能够离线工作
• 类应用交互：采用 Shell + Content 应用模型来创建类应用导航和交互
• 新鲜：得益于 Service Worker 更新过程，透明地始终保持最新
• 安全：通过 TLS 提供服务（服务工作者要求）以防止窥探
• 可发现：由于 W3C 清单和服务工作者注册范围允许搜索引擎找到它们，因此可识别为“应用程序”
• 可重新启用：可以访问操作系统的重新启用 UI；例如推送通知
• 可安装：通过浏览器提供的提示进入主屏幕，让用户“保留”他们认为最有用的应用程序，而无需麻烦地进入应用商店
• 可链接：这意味着它们零摩擦、零安装、易于分享。URL 的社交影响力至关重要。

PWA 的三个基本标准

一个网站要想成为 PWA，必须满足三个基本标准，这三个标准在网络上得到广泛应用。它们是：

• 您需要在 HTTPS 下运行。

• 您需要一个 Web 应用清单。

• 您需要一名服务人员。

这句话是从 Aaron Gustafson 的文章“没错，那个 Web 项目应该是 PWA ” [发布于 2017 年 8 月 30 日] 中逐字逐句复制而来。我问 Aaron，那份看似权威的三项技术清单具体是从哪里来的（除了模糊的、普遍的互联网伪共识之外）。

他推荐我去读 Jeremy Keith 的文章，我重读了他的文章“ HTTPS + Service Worker + Web 应用清单 = 渐进式 Web 应用”。文章中，他引用了他自己之前发表的一篇文章“ Web 的进步”，文中他写道：

从字面上看，任何网站都可以成为渐进式 Web 应用程序：

• 切换到 HTTPS，

• 使用您的 metacrap 添加一个 JSON 清单文件，然后

• 添加服务人员。

后来，在回复Jason Grigsby 的推文时，他提出了与我现在相同的问题——“我同意你关于 PWA 的三个组成部分的观点，但据我所知，你是第一个宣称它是 PWA 的人。我错了吗？” 他回复道：

我对此感到非常惊讶。我一直以为我只是在重复渐进式 Web 应用的三个要素，而不是定义它们。但翻阅了所有文档后，我发现 Jason 可能是对的。这很令人惊讶，因为我以为这三个要素构成渐进式 Web 应用的原因显而易见——因为它们易于测试。

所以，关于其起源尚无定论。（到目前为止）

“渐进式 Web 应用”顶级搜索结果的定义存在差异

趁着这段时间，我想回顾一下谷歌搜索“渐进式 Web 应用”前五条结果中定义的变化。谢天谢地，我这么做了，因为我发现了一个宝藏（队列悬念）。

1. Google 开发者：渐进式 Web 应用

渐进式 Web 应用程序是一种具有 Web 覆盖范围的用户体验，并且：

可靠 ——即使在网络条件不确定的情况下也能立即加载并且绝不会显示 downasaur。

快速 ——通过流畅的动画快速响应用户交互，不会出现卡顿的滚动。

引人入胜 ——感觉就像设备上的自然应用程序，具有身临其境的用户体验。

2. Google Developers：您的第一个渐进式 Web 应用

渐进式 Web 应用 融合了 Web 和应用的精髓，带来极致体验。用户首次访问时，无需安装，即可在浏览器标签页中体验到它带来的便捷。随着用户与应用的互动逐渐加深，它的功能也会日渐强大。即使在网络不稳定的情况下，它也能快速加载；它还能发送相关的推送通知；它还会在主屏幕上显示图标，并以顶级全屏体验加载。

该资源还列出了规范的属性列表，但添加了第十个：

渐进式——适用于每个用户，无论选择哪种浏览器，因为它以渐进式增强为核心原则构建。

3.维基百科：渐进式 Web 应用

渐进式 Web 应用 (PWA) 是一种 Web 应用，其外观类似于常规网页或网站，但用户在浏览时可以像传统应用或原生移动应用一样。这类应用试图将大多数现代浏览器提供的功能与移动体验的优势相结合。

维基百科条目将 Web 清单和服务工作者列为“常用技术”，以支持 PWA 的定义特征（它引用了 Berriman 和 Russell 的观点）。

然后，瞧，在维基百科的脚注中，PWA 的技术基准标准正是出自 Alex Russell (🥁) 的一篇文章：“究竟是什么让某个东西成为了渐进式 Web 应用？ ” [发布于 2016 年 9 月 12 日]。（顺便说一句，这篇文章真是个宝藏💎）。

这让我很惊讶，原因有几个。第一，我以前怎么没在任何地方看到过这种说法？第二，讽刺的是，他在谷歌工作，而且据我所知，谷歌的资源并没有明确提到这些基本要求。

4. MDN：渐进式 Web 应用

渐进式 Web 应用使用现代 Web API 以及传统的渐进式增强策略来创建跨平台 Web 应用。这些应用可在任何地方运行，并提供多项功能，使其拥有与原生应用相同的用户体验优势。

PWAs 应该是可发现的、可安装的、可链接的、独立于网络的、渐进的、可重新参与的、响应式的和安全的。

与Google 开发者：您的第一个渐进式 Web 应用程序页面一样，此列表添加了“渐进式”，并包含 Russell/Berriman 列表中的所有其他属性，除了“新鲜”和“类似应用程序”，出于某种原因？

5. Smashing Magazine：渐进式 Web 应用初学者指南

渐进式 Web 应用程序利用最新技术，将 Web 应用和移动应用的优势完美融合 。您可以将其视为一个使用 Web 技术构建的网站，但其操作和使用体验与应用程序类似。浏览器、Service Worker 以及缓存和推送 API 的最新进展，使 Web 开发者能够允许用户将 Web 应用安装到主屏幕、接收推送通知，甚至离线工作。

它也引用了相同的特性，并链接回Google Developers资源。它还指出 PWA 是“最初由 Google 提出的”。

结束这段不必要的旅程

现在，最后，我将提出我对 PWA 的个人定义：

“渐进式 Web 应用程序”（PWA）既是构建网站的新理念的通用术语，也是具有一组三个明确、可测试的基线要求的特定术语。

一般来说，PWA 方法的特点是努力满足以下一组属性：

1. 响应式
2. 独立连接
3. 类似应用程序的交互
4. 新鲜的
5. 安全的
6. 可发现
7. 可重新接合
8. 可安装
9. 可链接

作为一个特定术语，网站可以根据以下三个基准标准进行测试，以符合 PWA 的资格：

1. 它必须在 HTTPS 下运行。
2. 它必须包含一个 Web 应用清单。
3. 它必须实现一个服务工作者。

一般属性集是由Alex Russell 和 Frances Berriman首次明确列举的，而这三个要求的集合也可以归功于Alex Russell。

PWA 是通过 Web 交付的应用（不同于通过应用商店打包和部署的原生应用）。正如Alex Russell 所说：

...它们只是补充了所有正确维生素的网站。

参考帖子的时间线：

• “渐进式 Web 应用：摆脱标签页束缚，却不失灵魂” [发布于 2015 年 6 月 15 日]
• “究竟是什么让某个东西成为了渐进式 Web 应用？ ” [发布于 2016 年 9 月 12 日]
• “命名渐进式 Web 应用” [发布日期：2017 年 6 月 26 日]
• “推动网络发展” [发布日期：2017 年 6 月 27 日]
• “是的，那个 Web 项目应该是 PWA ” [发布于 2017 年 8 月 30 日]
• “渐进式 Web 应用 (PWA) 到底是什么？说真的。 ” [发布于 2017 年 11 月 6 日，更新于 2018 年 4 月 21 日]
• “欢迎渐进式 Web 应用登陆 Microsoft Edge 和 Windows 10 ” [发布于 2018 年 2 月 6 日]
• HTTPS + Service Worker + Web 应用清单 = 渐进式 Web 应用[发布于 2018 年 5 月 16 日]

附注：这篇文章的草稿大部分都是在飞机上写的，没有Wi-Fi。我突然意识到我忘了重新打开一篇我打算参考的Jeremy Keith的文章。我点开它，它就在那里，缓存好了，可以离线浏览了🙃