PWA 参考：2018 年掌握 PWA 的精选链接

概述

教程

服务工作者

本文件汇总了学习如何实现渐进式 Web 应用的热门链接。更多关于 ITCS 的参考资料，请参阅Awesome Reference: Guide to Galaxy，它收集了计算机科学领域有价值的、热门的和最新的链接，涵盖编程语言、软件工程、服务器端应用、基础设施、信息安全、工业应用、数据科学、人工智能、前端技术（iOS、Android、RN、Electron）等。

概述

• 2016-谷歌为何认为你应该开始构建渐进式 Web 应用

案例研究

• PWA.rocks：Opera Dev Relations 团队收集的几个渐进式 Web 应用程序的展示。

• 示例应用程序：SVGOMG、吉他调音器、语音备忘录、Hacker News、构建 Google I/O 2016 渐进式 Web 应用程序

• AliExpress 案例研究：AliExpress 通过新的渐进式 Web 应用程序将新用户的转化率提高了 104%。

• eXtra Electronics 案例研究：United eXtra Electronics 利用 Web Push Notifications 将电子商务销售额提高了 100%。

• Jumia 案例研究：推送通知帮助 Jumia 扭转购物车放弃的局面，并将转化率提高 9 倍。

• Konga 案例研究：Konga 利用新的渐进式 Web 应用程序将数据使用量减少了 92%。

• Suumo 案例研究：日本顶级房地产网站通过网络推送通知增强新房源信息，通知打开率达到 31%。

• 2017-Twitter Lite 和大规模高性能 React 渐进式 Web 应用程序：了解如何消除世界上最大的 React.js PWAs 之一 Twitter Lite 中常见和不常见的性能瓶颈。

• 2017 年 - 将饿了么升级为渐进式 Web 应用程序：饿了么（中国最大的食品订购和配送公司）一直致力于将我们的移动网站升级为渐进式 Web 应用程序。

• 2017-Pinterest 渐进式 Web 应用程序性能案例研究：在这篇文章中，我们将介绍他们的一些工作，通过保持 JavaScript 包精简并采用服务工作者来实现网络弹性，从而在移动硬件上快速加载。

• 2017-HNPWA #项目#：Hacker News 阅读器作为渐进式 Web 应用

• Tinder 渐进式 Web 应用程序性能案例研究：JavaScript 性能优化技术、用于网络弹性的服务工作者和用于聊天参与的推送通知。

工具

• 2017-生产环境中的渐进式 Web 应用库：本文由 Addy Osmani 撰写。两年前，我们 Google 团队开始研究 JavaScript 库，以减少构建渐进式 Web 应用的阻力。

• Manifoldjs：PWA Builder：PWA Builder 将为您提供一种简单的方法来提供 PWA 中缺失的部分，并且不会让您的网站因您不需要或不使用的数据而受到拖累。

• Webpack 离线插件：此插件旨在为 Webpack 项目提供离线体验。它使用 ServiceWorker 和 AppCache 作为底层支持。只需将此插件添加到您的 webpack.config 中，并在客户端脚本中添加相应的运行时，您的项目就会通过缓存所有（或部分）Webpack 输出资源来实现离线功能。您也可以阅读《使用 Webpack 离线插件轻松创建离线应用》了解更多信息。

• react-progressive-web-app：一个基于 React 的存储库，针对渐进式 Web 应用程序开发进行了优化。

• RealFaviconGenerator：一种生成在不同浏览器上显示应用程序图标所需的所有图像、图标和相关文件的好方法。

• Android Asset Studio - 启动器图标生成器：生成 Android 风格的图标。

• pwmetrics #项目#：触手可及的渐进式 Web 指标

教程

• 2017-制作渐进式 Web 应用程序的初学者指南：希望这篇文章能够满足您开始制作自己的 PWA 所需的全部内容。

• 2017-基于 Vue JS、Webpack 和 Material Design 的渐进式 Web 应用程序#系列#：本教程将分为几个部分，陆续发布

• 2017-渐进式 Web 应用 (PWA) 中文版 #书籍#：本书采用独立章节编写，让您无需阅读前几章即可了解感兴趣的特定功能。读完本书，您将能够构建更出色的 Web 应用程序并提升用户体验。

• 2016-基于 React.js 的渐进式 Web 应用 #系列#：渐进式 Web 应用利用新技术，为用户带来移动网站和原生应用的最佳体验。它们可靠、快速且引人入胜。它们源自安全来源，无论网络状态如何都能加载。

• 2016-Google 开发者 - 您的第一个渐进式 Web 应用程序：使用应用程序外壳模式构建渐进式 Web 应用程序的分步指南。

• 2016-构建渐进式 Web 应用程序 - O'Reilly Media：深入探讨渐进式 Web 应用程序、服务工作者、推送通知、后台同步、IndexedDB、离线优先等（免责声明：由本页面的维护者撰写）。

• 2015-渐进式 Web 应用初学者指南：渐进式 Web 应用可能是移动 Web 的下一个重大突破。该技术最初由谷歌于 2015 年提出，由于开发相对简单，并且几乎可以立即提升用户体验，它已经吸引了众多关注。

• 2017-渐进式 Web 应用 — 响应式 Web 设计的下一步 — Julian Gaviria

• 2017-渐进式 Web 应用课程#课程#

可安装的 Web 应用程序

• 通过 Web 应用安装横幅提高参与度：应用安装横幅简介，并确保 Chrome 向用户提供您的 Web 应用。

• 使用 Chrome for Android 中的 Web App Manifest 安装的 Web 应用程序：介绍在 Chrome for Android 中安装的 Web 应用程序。

推

• Chrome 平台状态 - Web 通知：Chrome 和其他浏览器的实施状态。

• PWA Dev Summit 2016 代码实验室 - 推送通知：渐进式 Web 应用程序、推送通知和服务工作者基础知识的最新入门教程。

• 使用 Push API：一篇介绍 Push API 的文章。

• web-push-libs：用于不同技术（Node.js、PHP、Python 等）的 Web 推送的有用库的集合。

服务工作者

• 浏览器中的 Service Workers 支持：我可以使用 - Service Workers 吗，Service Workers 准备好了吗？

• 2017 - 使用 Service Workers 和 Background Sync 实现恢复在线后发送消息：当您发送短信但手机信号不佳时，即使您关闭了应用，它也会继续在后台尝试发送消息。很实用吧？在本文中，我们将了解如何使用 Service Worker 中的 Background Sync API 在 Web 应用程序中复制此行为。

• 2017 - 测试服务工作者：在这篇文章中，我们将研究 Chrome DevRel 团队一直在开发的最新服务工作者库中测试服务工作者的一些方法。

• 2017-Service Worker Mock：模拟服务工作者环境生成器。

• 超棒的服务工作者#Collection#：用于学习服务工作者的超棒资源集合。

• 使用 IndexedDB 和服务工作者的离线 Web 应用程序：如果您计划构建渐进式 Web 应用程序，那么这门免费的 Udacity 课程是必修课。

• 服务工作者 W3C 规范：官方服务工作者规范。

• 介绍后台同步：简单介绍后台同步，以及一些精彩的视频和代码示例。

• 后台同步说明：后台同步的官方“解释”文档，包括一次性同步和定期同步。

• 后台同步规范：后台同步的 WIP 规范。

• 服务人员，你是什么？

• ServiceWorker 规范

• 尝试使用后台获取 API：随着使用后台驻留工作者的方式越来越多，服务工作者 API 也在不断扩展。

离线存储

• 2016-渐进式 Web 应用的离线存储：浏览器中离线存储的当前状态

• IndexedDB API：来自 Mozilla 的 API 文档、关键概念和示例代码。

• CacheStorage API：API 文档和来自 Mozilla 的示例代码。

• 2017-Redux 离线

• 2017-离线食谱：通过 ServiceWorker，我们放弃了尝试解决离线问题，而是为开发人员提供了自己解决问题的移动部件。