小程序setdata优化_【微信小程序】性能优化

内容整理于微信公开课

为什么要做性能优化？

一切性能优化都是为了体验优化

1. 使用

打开是一直白屏

打开是loading态，转好几圈

我的页面点了怎么跳转这么慢？

我的列表怎么越滑越卡？

2. 我们优化的方向有哪些？

启动加载性能

渲染性能

3. 启动加载性能

1. 首次加载

你是否见过小程序首次加载时是这样的图？

这张图中的三种状态对应的都是什么呢？

小程序启动时，微信会为小程序展示一个固定的启动界面，界面内包含小程序的图标、名称和加载提示图标。此时，微信会在背后完成几项工作：下载小程序代码包、加载小程序代码包、初始化小程序首页。下载到的小程序代码包不是小程序的源代码，而是编译、压缩、打包之后的代码包。

2. 加载顺序

小程序加载的顺序是如何？

微信会在小程序启动前为小程序准备好通用的运行环境。这个运行环境包括几个供小程序使用的线程，并在其中完成小程序基础库的初始化，预先执行通用逻辑，尽可能做好小程序的启动准备。这样可以显著减少小程序的启动时间。

通过2，我们知道了，问题1中第一张图是资源准备(代码包下载)；第二张图是业务代码的注入以及落地页首次渲染；第三张图是落地页数据请求时的loading态(部分小程序存在)

3. 控制包大小

提升体验最直接的方法是控制小程序包的大小，这是最显而易见的

勾选开发者工具中“上传代码时，压缩代码”选项；

及时清理无用的代码和资源文件(包括无用的日志代码)

减少资源包中的图片等资源的数量和大小(理论上除了小icon，其他图片资源从网络下载)，图片资源压缩率有限

从开发者的角度看，控制代码包大小有助于减少小程序的启动时间。对低于1MB的代码包，其下载时间可以控制在929ms(iOS)、1500ms(Android)内。

4. 采用分包加载机制

根据业务场景，将用户访问率高的页面放在主包里，将访问率低的页面放入子包里，按需加载；