前言
小组件的性能优化是提升开发者体验的重要一环，同时从业务转化角度是小组件在现有流量场景下获取最大转化、减少用户流失的有效方法，因此小组件的性能优化拥有重大的意义。
关于更快的首屏核心数据请求：
更早的首屏数据请求发出；
更快的加速请求的访问；
更快的返回首屏数据；
关于尽早 setData：
降低逻辑层代码大小，减少初始化时间，以尽早的将首屏核心数据给渲染层；
关于渲染：
减少渲染层资源加载耗时，让渲染层尽早的处理首屏数据渲染；
减少重绘重排，提前预热解析过程，尽早更快的完成渲染；
在优化思路了解了之后，我们来看下关于以上优化的具体有效方法有哪些。
- 提前发出请求
小组件页面渲染通常依赖后端数据的返回，如果请求发出过晚或请求耗时过长，会影响页面渲染。提前将请求发出的接入可以参考提前发出请求。
- 合理使用 setData
（1）适合场景
当核心 setData 渲染太耗时，且处理首次渲染 -> 核心 setData 中间有空闲的时间，可精心构造 Page initData 促使渲染层预热机制进行元素预创建，待核心数据返回后，仅进行真实内容的替换，可节省 DOM 创建及处理的时间。
（2）避免不完整页面长期展示
预热过程一般没有渲染真实数据，故页面内容可能没有实际意义（可能仅存在一些静态模板），可先添加 loading 动画，待核心数据 setData 后再将其去掉，显示真实渲染内容，以提升用户体验。 - 分屏渲染
在很多业务场景中。小组件页面高度远超一屏，如果一次性渲染页面的所有内容会导致首屏加载时间过长，用户体验较差。实际上，当用户打开页面时，只需渲染出可视范围的内容即可，这样不仅可以优化小组件的性能，还可以为用户提供更好的使用体验。具体的优化方式可以参考分屏渲染。
- 包优化
包优化对小组件包的编译产出进行了优化，通过合理的包结构拆分将逻辑层和渲染层产物按需打包，并对 css 进行了编译预处理，从而减少逻辑层和视图层的资源加载耗时，提升了页面性能。
- 端能力缓存
小组件可能会重复调用很多 API，而这些 API 的调用结果是不变的，例如 getSystemInfoSync 等，建议根据业务情况，将结果进行缓存。具体的优化方式可以参考端能力缓存
- 去除无用 Log
小组件中可能存在很多 console.log，而 console 的调用会跨端，阻塞后续的逻辑，建议全部清除掉，如果开发调试过程中需要，可以仅在生产环境下对 log 做清除。
- 图片优化
如果页面中的图片使用不合理，加载时将会消耗更多的系统资源，从而影响整个页面的性能，因此做好图片优化非常重要。常用的图片优化方式可以参考图片优化。