饿了么免单活动8月18：饿了么双十一 PHA 会场实践

饿了么免单活动8月18：饿了么双十一 PHA 会场实践会场页面的首屏接口耗时较长，部分甚至达2s以上，为了缩短页面加载耗时，对首屏接口进行预请求。考虑到饿了么端之前已通过TSchedule支持了接口预请求的能力和包大小问题，因此决定不引入pha的prefetch模块，而是借助饿了么现有能力对pha进行data prefetch的适配化改造。2业务接口预加载优化前后链路对比：下面具体展示预热效果（左侧为未开启预热，右侧为开启预热状态）：效果视频请点击查看：饿了么双十一 PHA 会场实践

饿了么端特色性能优化

1PHA webview预热

打开pha首屏页面和切换tab时需要执行容器创建和主文档加载，有较长时间的白屏，体验不佳。预渲染页面无疑是性能效果最佳手段，但一方面会造成资源浪费，另一方面也会带来很大的内存压力，不能随意滥用，后续若能和端智能更好结合或许才能更好的发挥它的价值。

饿了么端对首屏外的tab采用了预热方案（预热页面最大个数可配置），来消除tab切换时的白屏时间。预热和预渲染的不同点为：预热在离屏阶段拿到主文档后不发起首屏接口请求。在首屏页面渲染完成后，将剩下的底部和顶部item对应的webview都预热并缓存好，当用户点击对应tab时再消费webview进行上屏操作，具体实现复用pha/preload子模块链路并进行了一些改造，参考了TSchedule的预渲染逻辑。主要流程如下图所示：

优化前后链路对比：

下面具体展示预热效果（左侧为未开启预热，右侧为开启预热状态）：

效果视频请点击查看：饿了么双十一 PHA 会场实践

2业务接口预加载

会场页面的首屏接口耗时较长，部分甚至达2s以上，为了缩短页面加载耗时，对首屏接口进行预请求。考虑到饿了么端之前已通过TSchedule支持了接口预请求的能力和包大小问题，因此决定不引入pha的prefetch模块，而是借助饿了么现有能力对pha进行data prefetch的适配化改造。

由客户端同学提前发布orange（开关配置发布平台）预请求配置，pha会场在首屏路由、底部tab切换、顶部pageheader切换时提前触发接口预请求，也提供jsapi供前端自行调用预请求，优化效果明显，目前已经是饿了么端会场业务必备优化项。

(1)、首屏webview加载前网络数据异步预请求