渐进式 Web 应用程序:Web 开发的未来?

已发表: 2016-10-17

渐进式 Web 应用程序Service Workers是相对较新的概念,也是目前正在破坏当前网站和移动应用程序生态系统的核心部分。 我们已经看到转化率大幅上升和跳出率下降,因为这项技术得到了谷歌的支持。 阅读有关 Service Worker 和渐进式 Web 应用程序的更多信息,以及它们与移动应用程序和传统网站的区别。

Service Worker有时也简称为“SW”,它被编码为一个独立的脚本,与传统的网站页面和脚本一起运行,但与 Internet 上的网站上常见的 JavaScript 相比,它具有令人兴奋的新功能。

通过离线功能、推送通知、完全缓存以及连接到智能手机和其他设备的硬件 API 的附加可能性,选项仅受开发人员的独创性和设计师的创造力的限制。 虽然同时使用 Service Worker 和传统网站技术有很多优势,但我们将从企业主的角度来看待新兴趋势。

为什么要使用渐进式 Web 应用程序?

  • 与网站和移动应用程序的速度相比提高速度
  • 减小页面大小
  • 离线功能
  • 访问特定的硬件设备
  • 推送通知
  • 添加到主屏幕

以上是企业主在其现有网站中实施Service Worker渐进式 Web 应用程序的 6 个最常见原因的列表。 让我们将它们分解并详细了解 6 个关键点中的每一个。

提高速度和转化率

因为服务工作者在浏览器和 Internet 访问之间运行,这意味着网站访问者不必每次在访问者请求新页面或单击链接时都向网络服务器请求响应。

由于 Internet 协议的工作方式,每个响应通过网络的时间最少,但是通过使用 Service Worker,有时这一步可以省略,因为 Service Worker 脚本将从将在下一个主题中描述的本地缓存。

例如,Housing.com 自从实施了渐进式网络应用程序服务工作者脚本后,页面加载速度提高了 30%,而且由于大多数访问者从 3G 网络浏览,因此总部设在印度,这相当于一个很好的结果,并且任何速度提高都是因此相当重要。

另一个例子是 Konga,一家领先的尼日利亚电子商务零售商,其 60% 以上的访问者通过缓慢的 2G 网络浏览因此通过减少加载页面的时间,他们不仅显着提高了转化率和跳出率,而且同样重要的是,他们让竞争对​​手陷入了沉睡。

减小页面大小

结合以上几点,使用Service Worker无疑会减少任何网站的页面大小,从而降低跳出率。

我们看到这种改进的原因是服务工作者在访问者的手机和平板电脑上保存了网站的副本。 这意味着,一旦他们访问了安装了 Service Worker 并设置为自动上传缓存的网站的主页,他们就完全不必使用 Internet。

也可以简单地让 Service Worker 保存已经访问过的页面,但是由于用户无法以任何方式看到缓存的下载,所以让用户下载所有内容是有意义的。

目前,一些企业报告说,安装了 Service Worker 后,页面大小已减少了 90%。

离线功能

可以使用 Service Worker 开发一个网站,该网站将完美运行,用户无需访问互联网即可浏览页面和加载内容。 有一些要求,但一旦满足,Service Worker 就允许离线和在线体验之间的无缝集成,并且被认为是对当前网站的改变游戏规则的补充。

虽然不是每个网站都需要完整的离线体验,但像 Opera 一样简单地添加一个离线屏幕会增加用户在浏览时失去互联网访问权限时停留在页面上的机会。

将默认浏览器中的离线消息与 Opera 下面创建的自定义离线消息进行比较,感受一下不同之处:

Opera 的离线网站功能

Opera Progressive Web App 离线页面

chrome 中的默认离线页面

默认 Chrome 离线错误消息

访问特定的硬件设备

就像移动应用程序一样,渐进式 Web 应用程序Service Worker 相关联可以对硬件设备(例如移动相机、加速度计和其他常见功能)进行 API 调用。 到目前为止,尚不支持指纹识别等高级功能以及类似的新功能和复杂功能,但这可能只是时间问题。

虽然移动应用程序开发将始终与某些类型的企业和产品保持相关性,但今天已经有许多在线渐进式网络应用程序提供移动应用程序的体验,以及网站必须提供的易用性和安装性。

但鉴于该技术本身在撰写本文时才大约一岁(于 2015 年底开发),它有很多机会成为每个小企业主都希望成为其中一部分的最热门技术。

推送通知

这些硬件功能之一是推送通知,使网站所有者能够让移动用户了解他们的最新内容。 对于企业来说,访问客户的通知源对企业来说是一个巨大的福音。

与电子邮件通讯不同,人们倾向于直接在手机上打开和点击推送通知,虽然这种趋势可能会随着时间的推移而改变,因为用户会了解哪些应用程序正在推送营销和广告内容,但目前它非常有效。

迄今为止,非洲电子商务网站 Jumia 在渐进式网络应用程序和推送通知方面取得了巨大成功。 与向用户发送电子邮件询问他们是否愿意购买废弃购物车中的商品的传统方式相比,他们报告废弃购物车的转化率提高了 9 倍。 Jumia 还看到了 38% 的推送通知打开率,这不得不说是相当令人印象深刻。

添加到主屏幕

这是我们名单上的最后一个,但并非最不重要。 将您最喜欢的网站添加到手机的书签并在您的设备上添加一个图标并不是什么新鲜事,但是对于渐进式网络应用程序,浏览器现在会提示用户是否要将 PWA 添加到他们的主屏幕。 由于这是由浏览器本身完成的,而不是由网站上的一些花哨的弹出窗口覆盖,因此人们一直报告使用此功能取得了不错的效果。

add_to_home_screen 渐进式 Web 应用程序提示

这就是您使用 Chrome 或 Opera 从手机访问华盛顿邮报时的样子。

FlipKart 的用户通过主屏幕打开应用程序的转化率提高了 70%,这意味着安装该应用程序的用户可以说是忠实客户,渴望购买相关网站并与之互动。

结论

并非所有网络浏览器都支持渐进式网络应用程序服务工作者,但这也许只是时间问题。 使用 Internet Explorer 的微软在未来对该技术的实施方面一直含糊其辞,也许在等待看看这是否只是一个短暂的趋势,或者这是否会彻底改变我们所知道的网络。

带有 Safari 的 Apple 已经在他们的 5 年路线图中添加了service workers兼容性,所以还有一些时间来实现这一点,尽管一旦他们看到服务的积极影响,他们很可能会把这项技术放在列表的首位工人有。