0x00 写在前面

目标问题

  • 提高加载性能
  • 提高渲染性能


0x01 提高加载性能

控制代码包的大小

  • 压缩代码,减少无用代码
  • 图片及非必要文件放在CDN
  • 分包

优化异步请求

  • 在onLoad阶段就可以发起请求
  • 及时性要求不高的话尽量把请求结果缓存一下,下次直接用


0x02 提高渲染性能

先了解一下 setData

  • 具体情况不在这里叙述,请自行Google
  • 必须清楚一点:setData 通信开销很大

优化 setData

  • 减少 setData 数据量,不会影响渲染层的数据请不要放在setData中
  • 减少 setData 次数,尽量合并 setData 的请求以减少通信次数
  • 对列表改动不大的情况下请使用局部刷新,避免对整个列表数据刷新导致的页面卡顿或者出现长时间没有数据的空白

一些经验

  • 小程序共享一个js运行环境,A页面跳转到B页面时A页面的定时器等js操作不会停止甚至会抢夺B页面资源,因此要求我们必要的时候请手动清理这些代码
  • 尽量避免监听 onPageScroll 事件,尽量避免在 onPageScroll 中执行复杂逻辑, 尽量避免在 onPageScroll 中频繁 setData


0x03 写在后面

心得体会

  • 真机效果可能和微信开发工具中的不一样,IOS和Android效果可能不一样
  • 基本上的坑都是经验,而非真正的计算机知识,也就是说,如果小程序api改动的话优化方案可能也得跟着改变
  • Date:Sat Mar 02 2019 10:13:26 GMT+0800 (中国标准时间)

参考文章