PWA 与 AMP：如何做出正确的决定？

已发表: 2019-07-26

目录

最新统计数据证实，有 46.8 亿移动用户在积极上网和浏览网页。 近 3 年前，移动流量首次超过桌面流量，声称 51.3% 的互联网用户是移动设备用户，并且这个数字一直在不断增加。 尽管这个术语自过去十年以来一直在流传，但现在确实是“移动优先”时代已经开始。

因此，看到组织首先致力于为移动用户提供更好的服务和体验也就不足为奇了。 然而，几年前，当 PWA 和 AMP 推出时，谷歌就加入了移动潮流。

PWA 和 AMP 都旨在增强用户在使用移动设备兼容平台时的 Web 体验。 但是用户经常对 PWA 和 AMP 感到困惑。

让我们为您节省一些时间，帮助您了解 PWA 和 AMP 之间的区别。

什么是 PWA？

Starbuck Progressive Web App 示例
星巴克——最好的 PWA 示例之一

PWA代表Progressive Web App ，它旨在通过在浏览器上访问其网页，为用户提供移动应用程序的外观和体验。

换句话说，PWA 是一个优化的网页，可以提供类似应用程序的功能。 此外，当在移动 Web 上访问平台或其服务时，PWA 可以工作，但无需安装其移动应用程序。

如前所述，PWA 专注于提供类似应用程序的功能。 这包括：

  • 页面之间的更快转换
  • 一个完整的类似应用程序的界面
  • 能够发送推送通知（需要用户许可）
  • 离线内容可访问性等。

对于那些不熟悉“PWA”一词的人，我们这里有一份 PWA 综合指南，可以满足您的所有需求。

我们已经有了移动应用程序，那么为什么我们需要渐进式网络应用程序呢？

我们都知道移动设备允许用户从 App Store 或 Google Play 下载原生应用程序，但 PWA 更好。 为什么以及如何？

Andrew Gazdecki 在福布斯的一篇文章中回答了这个问题，“ PWA 比原生应用程序更高效。 它们按需工作并且始终可以访问，而不会占用智能手机宝贵的内存或数据。 通过选择在同一应用程序的本机版本上使用 PWA，用户消耗的数据更少。 然而，这并不意味着用户需要牺牲原生应用的便利性。 他们仍然可以将 PWA 保存到他们的主屏幕——它可以安装，无需真正下载。”

亚马逊应用与 PWA

最近，我们使用的最流行的原生移动应用程序正在使用 PWA 使他们的平台更易于访问，尤其是电子商务和社交媒体门户。

 推荐阅读：Progressive Web App vs Native App：哪个更适合你？

到你了：

对于寻求全方位完美 Progressive Web App 解决方案的 Magento 商家，我们在 SimiCart 为您和您的商店提供完整的软件包。 立即探索！

接下来，什么是AMP？

AMP 加速移动页面

AMP 或 Accelerated Mobile Page 由 Google 于 2015 年推出，旨在为移动设备创建更快的加载网页。 Google 开源了“AMP 项目”来帮助开发人员构建这些网页。

为了创建适合移动设备的网站，删除了不必要的（内联）JavaScript。 此外，CSS 被限制为 50KB 以供内联使用，并且 Google 缓存网站内容以提供类似 CDN 的功能。 除其他功能外，AMP Web 组件还提供（有限的）JavaScript 插入，作为 AMP 库的一部分，您可以使用它向移动网页添加动画，而不会有延迟的风险。

AMP 加速移动页面示例

在当前场景下，AMP 不再局限于网站。 有 AMP 广告、AMP 电子邮件，甚至 AMP 故事。 所有这些的 AMP 版本都是为了在移动设备上快速呈现而构建的。

图片来源：横幅小吃

“这些天来，如果不是即时的——它还不够快。 如果广告速度缓慢并且破坏了用户体验，即使是最令人难忘的创意也无法发挥其作用。” 解释 AMP 网站。

正如广告所预期的那样，AMP 广告通过获得更好的点击率来最大限度地提高投资回报率。 它们被证明可以提供相同的效果。 Triplelift – 一家原生广告技术公司，其收入增长了 13%，这归功于使用 AMP 广告将广告加载速度提高了 6 倍。

PWA 与 AMP：差异

比较 AMP 与 PWA

AMP 和 PWA 可以一起使用吗？

是的，AMP 和 PWA 可以一起使用，以提供优雅的用户体验。 这是它的样子：

首先，用户搜索服务，启用 AMP 的结果出现在他/她的屏幕上。 这意味着一个轻量级和预缓存的网站正在等待用户点击。 一旦用户点击该网站，发布者就可以通过要求发送推送通知的类似应用的网页 (PWA) 吸引用户。 该网页为用户提供了以下功能：

  • 内容和服务的离线浏览
  • 即使在互联网连接缓慢的情况下也能平稳过渡
  • 类似应用程序的体验

是什么阻止我们采用这个想法？

嗯，主要的挑战是发展。 虽然 AMP 遵循仅使用 HTML 和 CSS 并完全避免使用 JavaScript（大部分情况下）的规则，但 PWA 页面主要使用启用了 JavaScript 的服务工作者来设计。

但是，可以通过创建用于 SERP 的单独 AMP 页面来解决此问题，然后将流量转移到 PWA 页面。 这意味着 AMP 页面可用于在搜索引擎上获得良好的排名，一旦用户点击打开 AMP 页面，浏览器就会启动 PWA 页面以提高用户参与度和留存率。

总结一下

PWA 和 AMP 是针对手机的不同技术。 AMP 用于更快地加载网页，PWA 用于提供原生应用程序的外观和感觉，这对于移动商务网站非常有用。

根据 Adob​​e 的研究，从 2018 年 11 月 1 日到 12 月 31 日，他们 40% 的收入来自移动设备。10.5% 的移动流量带来了转化，而桌面流量的转化率为 7.4%，很明显，企业，无论大小，都应该认真对待他们的移动受众，并根据他们的需求开始投资于 AMP、PWA 和/或两者。

最后，两者都是提高网站性能和用户体验的强大工具。 您可以选择两种技术中的任何一种，也可以简单地实施两种技术以体验两者的最佳效果。 这是你的选择。

推荐帖子：渐进式 Web 应用程序 (PWA) 是否有利于 SEO？ （带有统计和示例）

探索 SimiCart PWA