渐进式网络应用程序（PWA）是使用网络平台技术构建的应用程序，但它能提供类似特定平台应用程序的用户体验。
特定平台的应用程序
特定平台的应用程序是为特定的操作系统（OS）和/或设备类别（如 iOS 或 Android 设备）开发的，通常使用平台供应商提供的软件开发工具包（SDK）。它们通常通过供应商的应用商店进行分发，用户可以在那里找到并安装它们，随后在用户看来，它们就像是设备的一项永久性附加功能，以某种方式扩展了设备的能力。
特定平台应用程序的优点包括：
易于用户访问：它们在设备上有自己的图标，方便用户查找和打开。
离线和后台运行：即使用户未与之交互且设备离线时，它们也能够运行。例如，这使得聊天应用程序在未打开时也能接收消息，并向用户显示通知。它还使新闻应用程序能够在后台更新，以便在设备离线时也能显示新内容。
专属用户界面：它们可以实现自己独特、沉浸式的用户界面。
操作系统集成：它们可以集成到主机操作系统中：例如，消息应用程序可以注册为共享目标，使用户能够在照片应用程序中选择图像并使用该消息应用程序发送。它们还可以访问设备功能，如相机、GPS 或加速度计。
应用商店集成：它们通过应用商店分发，为用户提供了一个查找它们的单一位置和一种决定是否安装它们的一致方式。
传统网站
传统上，网站不太像是“用户拥有的东西”，而更像是“用户访问的地方”。通常，一个网站：在用户未访问时不在用户的设备上存在，只能通过用户打开浏览器并导航到该网站来访问，并且高度依赖网络连接。
然而，网站相对于特定平台的应用程序具有一些优点，包括：
单一代码库：由于网络本质上是跨平台的，一个网站可以通过单一代码库在不同的操作系统和设备类别上运行。
通过网络分发：网络是一个出色的分发平台。网站被搜索引擎索引，并且可以仅使用 URL 进行共享和访问。网站可以分发，无需在任何供应商的应用商店注册。
渐进式网络应用程序
渐进式网络应用程序结合了传统网站和特定平台应用程序的最佳特性。
PWA 具有网站的优点，包括：
PWA 使用标准的网络平台技术开发，因此可以从单一代码库在多个操作系统和设备类别上运行。
PWA 可以直接从网络访问。
PWA 还具有许多特定平台应用程序的优点，包括：
PWA 可以安装在设备上。这意味着：
PWA 可以从平台的应用商店安装，也可以直接从网络安装。
PWA 可以像特定平台的应用程序一样安装，并且可以自定义安装过程。
安装后，PWA 会在设备上获得一个应用图标，与特定平台的应用程序并列。
安装后，PWA 可以作为独立应用程序启动，而不是在浏览器中的网站。
PWA 可以在后台和离线运行：典型的网站只有在浏览器中加载页面时才处于活动状态。PWA 可以：
在设备没有网络连接时工作。
在后台更新内容。
响应服务器的推送消息。
使用操作系统的通知系统显示通知。
PWA 可以使用整个屏幕，而不是在浏览器用户界面中运行。
PWA 可以集成到设备中，注册为共享目标和源，并访问设备功能。
PWA 可以在应用商店中分发，也可以通过网络公开分发。
PWA 与浏览器
当您在浏览器中访问一个网站时，很明显可以看出该网站是“在浏览器中运行”。浏览器用户界面为网站提供了一个可见的框架，包括后退/前进按钮和页面标题等用户界面功能。您网站调用的 Web API 由浏览器引擎实现。
PWA 通常看起来像特定平台的应用程序——它们通常显示时没有周围的浏览器用户界面——但从技术上讲，它们仍然是网站。这意味着它们需要像 Chrome 或 Firefox 中的浏览器引擎来管理和运行它们。对于特定平台的应用程序，平台操作系统管理该应用程序，提供其运行的环境。对于 PWA，浏览器引擎扮演这个后台角色，就像对普通网站一样。
比较传统网站、PWA 和特定平台应用程序运行时环境的图表
在我们关于 PWA 的文档中，我们有时会提到浏览器扮演这个后台角色。例如，我们可能会说，“当收到推送通知时，浏览器启动 PWA 的服务工作者。”在这里，浏览器的活动完全在后台。从 PWA 的角度来看，启动它的也可能是操作系统。对于某些系统，如 Chromebook，“浏览器”和“操作系统”之间可能甚至没有区别。
PWA 的技术特性
因为 PWA 是网站，它们具有与其他任何网站相同的基本特性：至少一个 HTML 页面，很可能加载了一些 CSS 和 JavaScript。像普通网站一样，页面加载的 JavaScript 有一个全局 Window 对象，并且可以访问通过该对象可用的所有 Web API。
除此之外，PWA 还有一些其他特性：
一个网络应用程序清单文件，至少提供浏览器安装 PWA 所需的信息，如应用程序名称和图标。
可选的服务工作者，以提供离线体验。
网络应用程序清单
PWA 必须有一个网络应用程序清单，并且清单必须包含足够的信息供浏览器安装 PWA。
清单可以定义 PWA 外观的许多其他方面，如主题颜色和背景颜色，以及其行为，包括作为来自其他应用程序数据的共享目标或处理特定文件类型的能力。
服务工作者
虽然 PWA 不需要安装服务工作者，但为了提供至少最小的离线体验，PWA 经常使用服务工作者。
服务工作者鼓励一种架构，其中应用程序的页面——即网站的传统部分——实现用户界面，而服务工作者实现一个可以支持离线和后台操作的后端，使 PWA 更像一个应用程序而不是一个网站。这是因为在需要时（例如，处理推送通知），浏览器可以在后台启动服务工作者。
PWA 与单页应用程序
传统上，网站是作为相互链接的页面集合构建的。当用户从网站中的一个页面点击链接到同一网站中的另一个页面时，浏览器会将新页面作为一个全新的实体加载，包括 HTML 以及 HTML 加载的子资源，如 CSS 和 JavaScript。在单页应用程序中，网站由一个单一的 HTML 页面组成，当用户点击内部链接时，这由 JavaScript 从服务器获取新内容并更新页面的相关部分来处理。
单页应用程序可以提供更接近特定平台应用程序的用户体验，因此 PWA 经常被实现为单页应用程序。特别是，单页应用程序更容易实现无缝的用户界面，其中向用户呈现一个单一、一致的页面，并且只有在用户与应用程序交互时才更新页面的相关部分。
然而，PWA 不一定是单页应用程序，单页应用程序也不一定是 PWA。
渐进增强
虽然渐进增强对于大多数网站来说是一个理想的属性，但对于 PWA 来说尤其重要，因为 PWA 期望在广泛的设备上运行，并且经常使用可能并非所有浏览器都支持的高级 Web API。
渐进增强的一个基本组成部分是，如果用户通过在浏览器中输入其 URL 在网络上访问您的 PWA，用户可以像与普通网站交互一样与该应用程序交互。但是，如果浏览器可以安装它，用户将被提示安装，并且该应用程序将作为设备上的新功能出现。
PWA 应该对高级 API 进行功能检测，并提供可接受的回退体验。
例如，Background Sync API 使 PWA 能够要求服务工作者在设备具有连接时立即进行网络请求。这方面的一个典型用例是消息传递。假设用户编写了一条消息，但当用户试图发送消息时，设备离线。Background Sync API 使设备在连接后能够在后台发送消息。在不支持 Background Sync 的设备上，应用程序应该让用户知道消息无法发送，给他们稍后重试的机会。
发表评论