最近一批完成了PWA技术改造的网站陆续上线了离线访问功能,包括静态资源预缓存、核心页面秒级加载、弱网环境下的表单暂存等基础功能,实测数据显示,相关网站的用户重复访问率比改造之前提高了50%。

本次技术改造主要依靠Service Worker后台代理机制实现,站点不需要改变原有的业务主流程,只需要通过一个独立的脚本来完成网络请求拦截,结合版本化缓存策略,在用户首次打开的时候把首页、导航栏、核心图文资源等高频访问的内容保存到本地存储中。当用户处于地铁、电梯等网络不稳定的环境或者完全断网的情况下,站点可以直接从本地缓存里获取资源进行渲染,不需要等待网络响应,从而彻底解决了传统Web应用常见的断网白屏问题。
不同于原生应用需要单独下载安装包、占用大量设备存储空间的方式,完成改造的站点只需要用户在浏览器中点击一次添加到桌面按钮,就可以得到一个带有独立图标、没有地址栏的类原生应用窗口,整个安装过程耗时不到3秒,安装包大小一般都在1MB左右。一些站点针对高频操作场景增加了离线状态下操作暂存的功能,在断网的情况下提交的表单、编辑的内容会先保存在本地数据库中,等网络恢复之后再自动同步到服务器上,整个过程不需要用户重复提交。
根据已经上线的站点运行数据来看,改造之后的站点平均首屏加载时间由原来的4.2秒缩短到0.8秒,弱网环境下的页面可用率也由不到40%提高到了95%以上。多个垂直领域的站点运营数据显示,离线访问能力上线之后,用户单次访问停留时长平均提高了32%,因加载超时跳出的用户占比下降了61%,在移动网络波动较大的下沉市场,站点的用户留存表现提升幅度更大。
目前该技术方案已经应用于内容资讯、本地生活、工具服务等多个领域,不需要替换原有的建站框架,只需要添加Manifest清单文件和缓存规则就可以完成基本的改造工作,开发维护成本比单独开发双端原生应用要低60%以上。之后相关的站点会逐步扩大离线支持的功能范围,覆盖更多的非实时类的业务操作场景。