小程序webview 缓存_为何小程序上线了，他们的内心却留下遗憾？

作者：闲鱼技术-颂晨、玉缜

前言

出于多端投放和开放生态的考虑，闲鱼开始接入整个阿里小程序体系。闲鱼在9月份迅速上线了第一个小程序鱼塘小程序，由于刚接触不熟悉小程序体系，整体性能上有比较大的优化空间，主要表现在以下问题： 小程序加载慢，低端 Android 机（Android vivo Y67）上首屏时间接近6s 滚动卡顿，在 iPhone 7P 上滚动帧率平均在 40fps 左右 * 滚动多屏数据之后 Tab 点击切换慢，在 iPhone 7P 上切换 Tab 等待时间 3-5 秒，瞬时帧率低于 30fps 小程序由于其逻辑和渲染分离的架构特点，除传统 H5 优化手段之外还有其他不同点。本篇文章主要分析小程序构架对渲染的影响，以及鱼塘小程序下具体优化手段。

小程序架构

在分析具体优化 Case 之前我们先看下小程序架构，先要了解架构才能清楚如何去优化具体的业务代码。阿里小程序采用支付宝小程序的架构，这里引用一张支付宝小程序页面生命周期图。

目前市场上所有小程序都采用逻辑（worker）和渲染（webview）分离的方式。这样带来的好处是：

1. 能够满足对于外部应用管控的诉求，由于业务逻辑没有运行在 webview 上，所以无法通过浏览器的API直接操作渲染动作，意味着不能通过脚本做一些动态化操作。所有