用于构建渐进式 Web 应用程序(PWA)的前5个开源框架

PWA 是一种 Web 应用程序，旨在像移动平台上的本机应用程序一样运行，尽管它是通过 Web 交付的，你可以使用 PWA 来优化你的应用程序的移动 Web 体验。

PWA 为用户和开发人员提供了多种好处。 一旦用户下载并安装了你的应用程序，他们就可以使用它而无需一遍又一遍地登录。 此外，PWA 使用的内存尽可能少，这对用户来说是一个显着的优势。

以下是构建自己的 PWA 时应考虑的前五个开源框架的建议。

Webpack

Webpack 可以在客户端创建模块包，这意味着你的源文件将在处理你的代码时在服务器上进行解析和编译。它还可以按原样将编译的捆绑包传递给浏览器，而无需任何其他工作。

Webpack 会自动创建额外的模块，称为转译器，以包含在最终的 PWA 包中。它使用 Babel 在不同语言之间转换代码。这些模块通过利用特定于硬件的功能对代码进行局部优化。他们还负责 Babel 的翻译。

Babel 与全局模块和自定义模块一起使用，这对于自定义语言支持特别有用。在许多方面，Webpack 都是 PWA 创建的领导者，是创建 PWA 的出色工具，非常适合大中型公司。较小的公司可能希望依靠 AMP作为 PWA 的替代方案。

Ionic

Ionic 应用程序为你提供了两个关键优势，使它们成为开发 PWA 的正确方法。第一个是直接控制你正在使用的代码。应用程序开发人员通常对网站只有有限的权力。虽然大部分控制权不在开发人员手中，但在某些地方你可以施加一些控制权，例如，在部署或显示页面期间。渐进式网站为你提供了一些控制权。

第二个好处是增加了对内容的控制。在开发渐进式网站时，你可以使用 Ionic 的 UI 组件为网站添加额外的功能。这使代码更加灵活，并使你能够创建更加身临其境的体验。Ionic 是一个可靠的框架，在 PWA 解决方案还很新的时代，它是一个绝佳的选择。

PWABuilder

PWABuilder 让你可以轻松地将现有网站转换为 PWA。 你可以在 pwabuilder.com 上查看开源项目的生产版本。以下是使用 PWABuilder 的一些主要原因：

干净直观的用户体验

快速简单的开发

使用预置的排版、HTML、JavaScript、CSS 和 UX 简化部署

具有 CMS 功能的应用程序的自由度

PWABuilder 是一个出色的工具，可以转换网站并展示原始网站的“未来”PWA 版本。 这非常适合时间和预算有限的中小型站点。如果你的网站很大，那么 PWABuilder 就像一把瑞士军刀，试图解决所有问题，保持你的方法简单。

Angular

Angular 带来了渐进增强的概念。使用 Angular 中称为“指令”的方法，你可以使网站扩展到不同的设备。 这样，你可以编写适合任何设备的高质量代码，而无需对 HTML 代码进行重大修改。

Angular 的另一个优点是它使用 JavaScript 的超集 TypeScript。 TypeScript 会自动将你的 JavaScript 代码转换为你需要的语言，以使开发更加顺畅。 此外，TypeScript 是多语言的，这意味着它可以处理不止一种编程语言。

使用内置强大的 TypeScript 编译器和内部实时运行时，你可以两全其美。使用 TypeScript 编译器，你可以编写 JavaScript 代码，这意味着你可以访问最新的 JavaScript API，但你无需了解 JavaScript 的复杂性来编写你的网站。

AMP

为什么要考虑将 Accelerated Mobile Pages (AMP) 应用到你的网站？答案很简单：AMP 为开发者、出版商和出版商提供“快速、安全的出版体验”。

AMP 使用 HTML、CSS 和 JavaScript 快速加载网站并将其呈现到移动设备。 AMP 商店的数百个免费模板和主题使发布者可以轻松查找和测试与 AMP 兼容的技术。由于 AMP 是开源的，你可以将其整合到任何类型的网站中。

归根结底，你必须拥有一个可以快速适应任何屏幕尺寸的网站。你的用户可能也在使用平板电脑以及传统的笔记本电脑，如果你不使用 PWA，这些用户的体验可能不太理想，将你的网站开发为 PWA，你网站的用户体验会更好。

了解更多