2015年,国际电信联盟预测全球上网人口将达32亿,几乎占全球一半的人口。想象一下每秒钟的上网人数,32亿!大约需要32000个足球场才能装下这么多人!这几乎是一个大到无法理解的数字。当这些人上网时,他们使用的设备不尽相同、他们的网速也各不相同、甚至同一个的网速也会变化。作为 Web 开发者,试图满足所有这些不同的场景似乎令人望而生畏!这正是 PWA 出现的契机。它们赋予了开发者可以构建速度更快、富有弹性并且更吸引人的网站的能力,这些网站能够被全球数十亿人访问。
到底PWA 是什么?
渐进式网络应用 ( Progressive Web Apps ),即我们所熟知的 PWA。
PWA 有什么优势?
虽然我们的移动设备变得愈发强大,但我们的移动网络并不是总能满足需求。如果你使用智能手机,你就会知道移动连接是有多么的脆弱。2G、3G 或 4G 这些连接本身都很不错,但是如果所在的地方信号不好,它们时常会失去连接,或者网速变得很差。如果你的业务是跟网络相关的,那这就是你需要去解决的问题。
从历史上来说,原生应用 (下载到手机的) 已经能够提供更好的整体用户体验,你只要下载好原生应用,它便会立即加载。即使没有网络连接,也并非是完全不可用的: 你的设备上已经存储了供用户使用的绝大部分资源。原生应用具备提供有弹性、吸引人的体验的能力,同时也意味它的数量已经呈爆炸式增长。目前在苹果和 Google 的应用商店中,已经有超过400万的原生应用!
从历史上来说,Web 无法提供原生应用所具备的这些强大功能,比如离线能力,瞬时加载和更高的可靠性。这也正是 PWA 成为 Web 颠覆者的契机。主要的浏览器厂商一直在努力改进构建 Web 的方式, 并创建了一组新功能以使 Web 开发者能够创建快速、可靠和吸引人的网站。
PWA 是由什么组成的呢?
我们一直将它们作为一组功能和原理来讨论,但真正使某个网站成为 “PWA” 的到底是什么呢?最最简单的 PWA 其实只是普通的网站。它们是由我们这些 Web 开发者所熟悉和喜欢的技术所创建的,即 HTML、CSS 和 JavaScript 。然而, PWA 却更进一步,它为用户提供了增强的体验。
Google Chrome 团队的开发人员 Alex Russell 对PWA的描述方式是:“这些应用没有通过应用商店进行打包和部署,它们只是汲取了所需要的原生功能的网站而已。”
PWA 会指向一个清单 (manifest) 文件,其中包含网站相关的信息,包括图标,背景屏幕,颜色和默认方向。(在第5章中,你将学习到如何使用清单文件来使你的网站更加吸引人)
PWA 使用了叫做 Service Workers 的重要新功能,它可以令你深入网络请求并构建更好的 Web 体验。随着本章的深入,我们将进一步了解它们以及它们带给浏览器的改进。PWA 还允许你将其“添加”到设备的主屏幕上。它会像原生应用那样,通过点击图标便可让你轻松访问一个 Web 应用。(我们将在第5章中深入讨论)
PWA 还可以离线工作。使用 Service Workers,你可以选择性地缓存部分网站以提供离线体验。
有哪些PWA的使用案例与优化数据?
兰蔻(Lancôme):兰蔻推出PWA后,转化率提升了17%,iOS端的移动会话增加了53%,整体移动会话增加了50%。
Telegram:Telegram推出PWA后,用户增长率增加了175%,留存率增加了50%,用户基数每年增加40%,用户每次会话数增加了50%。
星巴克:星巴克在2017年推出了PWA,使用户在没有网络连接的情况下也能浏览菜单并定制订单。结果,日活跃用户翻倍,订单多样性增加了23%。
Twitter于2017年发布了Twitter Lite PWA,主要针对移动用户,尤其是网络不稳定的用户群体。结果显示,Twitter 的 PWA 使每次会话的页面数增加了 65%,推文数增加了 75%,跳出率降低了 20%,同时应用程序的大小减少了 97%。
这些成功案例展示了PWA在不同领域的广泛应用和显著成效,不论是电商、社交媒体、酒店预订还是奢侈品行业,PWA都帮助企业取得了明显的业务提升。对于任何想要优化移动用户体验并提高转化率的公司来说,PWA都是一个值得考虑的技术选择。
未经允许不得转载:PWA 出海网 » PWA 是什么?有哪些PWA的使用案例与优化数据?