前言
2018年7月份微信公开课上的小程序专场中“小程序性能优化”模块中提到了小程序性能优化方面的知识，其中从启动加载性能优化和渲染性能优化两个方面进行了阐述，提到了日常我们开发中如何去提高小程序的性能优化，以及小程序针对一些性能问题接下来会怎样的改进（其中就有分包预加载和独立分包等概念的提出）
自己本人只是一个做笔记的方式去记录，可能会有些许粗糙，大家可以直接去看演讲的视频，个人认为很精彩。因为是小程序，所以这边没有贴出来，大家可以直接去微信中搜“微信公开课”
启动加载性能优化
启动过程机制
- 资源准备（代码下载）
- 业务代码注入和渲染
- 异步请求数据（部分小程序）
控制代码包的大小
- 开启开发者工具中的“上传代码时候自动压缩”
- 及时清除无用代码和资源文件
- 减少代码包中的图片等资源文件的大小和数量
分包加载
分包加载的局限性和解决方法
- 分包预加载（即将推出的功能）
- 分包加载——独立分包（即将推出）
可以不依赖于珠宝，独立下载和运行的分包。从独立分包页面启动，只下载和注入分包就可以打开页面。
首屏加载的体验优化建议
- 提前请求：异步请求数据不需要等待页面的渲染完成。
- 利用缓存。利用storage API对异步请求数据进行缓存。二次启动的时候，先利用缓存数据渲染页面，再进行后台更新
- 避免白屏：先展示页面骨架和基础内容
- 及时反馈
渲染机制的优化
小程序的渲染机制
避免不当使用setData
- 使用data在方法间共享数据（可能增加setData传输的数据量）——建议data中仅包括与页面相关的数据
- 使用setData传输大量数据——仅仅传输变化的数据
- 短时间被频繁调用setData——对连续的setData进行合并
- 后台页面进行setData，抢占前台页面的渲染资源——页面在切入后台后的setData调用，延迟到页面重新展示的时候执行
总结：
- 每次setData的调用都是一次进程间的通信过程，通信开销与setData的数据量正相关的
- setData会引发视图层页面内容的更新，这一耗时操作一定时间内会阻塞用户交互
- setData是小程序中使用最频繁，也是最容易引发性能问题的
避免不当使用onPageScroll
- 只在有必要的时候监听pageScroll事件
- 避免在onPageScroll中执行复杂逻辑
- 避免在onPageScroll中频繁调用setData
- 避免频繁查询节点信息（SelectQuery），部分场景建议使用节点布局相交状态监听（IntersectionObserver）替代
使用自定义组件
