支付宝小程序 性能体验评测规范

1. 首页启动耗时检测

首屏内容全部显示出来的时间，代表了用户可以感受到的页面加载完成、可进行交互的时间，耗时过长会导致用户看到的都是白屏或者内容有缺失，用户会一直等待内容加载完成。建议检查加载过程中的所有操作，看是否存在请求数据耗时过长或者一次性渲染数据过大的情况。

2. 渲染界面耗时过长检测

渲染界面的耗时过长会让用户觉得卡顿，体验较差，出现这一情况时，需要校验是否同时渲染的区域太大。

3. setData 调用频率检测

避免频繁触发 setData 或者 $spliceData。需要频繁触发重新渲染时，避免使用页面级别的 setData 和 $spliceData， 将这一块封装成自定义组件，然后使用组件级别的 setData 或 $spliceData 触发组件重新渲染。长列表数据触发渲染时，使用 $spliceData 多次追加数据，而不用传递整个列表。复杂页面建议封装成自定义组件，减少页面级别的 setData。详情请参见 优化 setData 逻辑方案明细。

4. setData 数据量检测

setData 数据不宜过大，避免一次性传递过长的列表。首屏请勿一次性构造太多节点，服务端可能一次请求传递大量数据，请勿一次性 setData，可先 setData 一部分数据，然后等待一段时间（比如 400ms，具体需要业务调节）再调用 $spliceData 将其他数据传输过去。

5. AXML 节点数检测

建议一个页面使用少于 1000 个节点、节点树深度少于 30 层、子节点数不大于 60 个，一个过大的 DOM 树会引起内存消耗增长，样式计算时间过长，与复杂的样式规则相结合可能会严重减慢渲染速度。

6. JS 函数耗时检测

页面打开期间调用的 js 函数较多，如果多个函数执行耗时都较长，那串行起来会更长，会严重影响用户体验，因此建议对耗时较长的函数进行优化。

7. 请求耗时过长检测

请求的耗时太长会让用户一直等待甚至离开，应优化好服务器处理时间，可减少回包大小，可服务端 rpc/mtop/http 等网络请求预加载，让请求快速响应。

8. 短时间内发起太多请求检测

短时间内发起太多请求会触发小程序并行请求数量的限制，同时太多请求也可能导致加载慢等问题，应合理控制请求数量，甚至做请求的合并等。

9. 短时间内发起太多图片请求检测

短时间内发起太多图片请求会触发浏览器并行加载的限制，可能导致图片加载慢，用户一直处理等待。应该合理控制数量，可考虑使用雪碧图技术或在屏幕外的图片使用懒加载。

10. JSAPI 调用耗时过长检测

JSAPI 调用耗时过长，会影响 JSAPI 调用性能，应缩短单个 API 接口的耗时时长。

11. JSAPI 同步调用检测

同步 JSAPI 的调用过多将造成进程的阻塞，影响后续业务逻辑的执行。建议尽量避免同步调用，getSystemInfo、getStorage、getLocation、getCities 是同步调用的高发区。

12. JSAPI 重复调用检测

多次调用同一个 JSAPI，会增加无用耗时，应减少单页面同一 JSAPI 调用次数，采用缓存方式处理前一执行接口后的结果数据，减少调用次数。

13. 图片分屏检测

加载当前屏幕中暂时不需要展示的图片，会影响页面加载耗时，增大内存消耗，建议分屏懒加载。

14. 图片缓存检测

开启 HTTP 缓存控制后，下一次加载同样的图片，会直接从缓存读取，大大提升加载速度。

15. 图片大小检测

图片过大会导致网络请求耗时增加，使用户等待交互的时间过长，应尽量控制图片大小，建议进行压缩或合理剪裁。图片过大会影响包资源大小和加载耗时，应避免使用大图，合理压缩图片尺寸，图片格式建议转化成 SVG/webp，必要的大图从 CDN 渠道上传。

16. 图片尺寸检测

图片太大而有效显示区域较小时会增加内存的消耗，应根据显示区域大小合理控制图片大小。

17. 页面重复请求检测

发起请求总会让用户等待，可能造成不好的体验，应尽量避免多余的请求，比如对同样的请求进行缓存。

18. 页面请求域名收敛检测

页面多个请求的域名建议尽量收敛在一起，如果域名太过分散，DNS 和链接复用率低，影响资源的加载速度，同时也需要考虑同域资源是否有并行加载的能力。

19. 首页流量消耗检测

应避免页面加载对用户造成过大的流量开销，可以考虑使用资源合并、压缩等技术方案来降低流量开销。

20. 图片压缩检测

图片建议使用 webp、hevc 等压缩格式，这样不仅能提升网络传输效率和加载体验，同时也可以减少内存消耗和包体积。

21. 文本资源压缩检测

建议使用 gzip/deflate 等压缩技术来降低文件的网络传输负载，以提升资源传输速度。