Appearance
什么是 PWA
PWA 的介绍
是什么
PWA 即(Progressive Web Apps)渐进式网页应用程序,是一种对标原生应用的网站开发技术。PWA 被描述为有能力、可靠且可安装的网页程序。初接触 PWA 的时候,是使用 Docsify 官网 自带的 SW.js,在没有网络的情况下,也能迅速的加载网页内容,非常的神奇。
有什么好处
有能力
相比于原有网页平台更加强大的能力,虽然当前浏览器可以使用 WebRTC、地理定位、推送通知等方式来构建 APP。但是与原生平台的应用程序相比依然缺少了一些功能
PWA 和各个平台力推的小程序类似,添加了本地文件访问、媒体控制,应用程序标记和完整剪贴板等功能的支持。得益于这些新 API 的支持,网页程序也能与 Native App 相提并论了
可靠
可靠的 PWA 无论网络如何,都能给用户带来快速、可靠的体验
得益于 Service Worker、后台 JS 线程、Background-Sync 等技术的添加。面对缓慢、乃至是不可靠的网络环境下,PWA 通过缓存和网络优化也能得到良好的使用体验
可安装
已安装的 PWA 应用可以在独立的窗口中运行,而不是在浏览器选项卡中运行,它们的使用体验将会和原生应用类似,可以在设备上搜索或或是设置为不同类型文件的默认处理方式
跨平台支持
目前各大主流软件巨头都在推广 PWA 应用,PWA 不仅可以支持网页访问和当做原生应用,还可以加入 Microsoft Store 和 Google Play Store。利用 HTML 标准的通用性和对原生 API 的支持,实现了一次开发、处处运行
存在什么问题
配置复杂
与传统的 HTML、JS、CSS 的组合不同,PWA 需要编写一个符合要求的 service-worker.js 文件以提供合适的预拉取和缓存等功能。同时需要完善的降级开关,当出现问题时,通过更新或降级的方式修复存在的 BUG 或直接注销 service-worker
为了实现添加到主页功能,PWA 还需要配置 manifest.json 以配置安装后的应用图标、启动网页地址等条目
PWA 应用概况
PWA 的未来
PWA 标准由 Google 和 W3C 首推,目前微软也在力推 PWA 应用。由于可以从浏览器直接安装、应用内支付等功能可以绕过应用商店的审核,直接推送给用户。因此这就触碰到了 Apple 的利益,IOS 平台(webkit 内核)上 PWA 的体验要弱于安卓手机
一个新的事物想要推广并不只是看技术好坏,流量和商业化有时比技术更能决定新事物生死。技术方面国内各类的小程序与 PWA 相比没有决定性的区别,而在流量上微信提供了一个跨越各大平台、月活 10 亿的庞大社交网络。而且微信还是一个相当明智的平台,一方面不断地降低小程序的开发门槛,另一方面还提供了便捷的广告和支付接口,方便流量变现。因此,PWA 在国内也变得有些尴尬
国内存在的问题
由于国内的浏览器市场及其的分散,而且各大软件服务提供商还力推自己的小程序。因此作为较新技术的 PWA 面临着巨大的兼容性考验
而且对标原生 APP 通知的 Push API 由于一般使用的是 Google 的 GMS 服务。面对国内各种各样的实现标准,Server Push API可以说是半废阶段
国内多端开发的支持情况
国内各大应用都在主推自己的小程序,但小程序内Web-View和应用内浏览器对PWA的支持都不容乐观。如共同的基本不支持service-worker线程、大部分应用浏览器的本地文件销毁(cookies、localstorage等)。因此不可能在各大APP内嵌套发挥PWA应用的全部能力
不过目前各大手机浏览器对PWA的支持尚可,因此在合适的引导下,用户还是能安装PWA应用的。国内PC端浏览器的支持力度不大,但是似乎可以从windows应用商店入手
目前应用状况
国外案例
- Flipcart
- Instangram
- Uber
- Starbucks
国内案例
- 百度贴吧
- 饿了么
- 哔哩哔哩
- 微博