小程序中多张图片懒加载方案

由於小程序对用户内存使用进行了限制如果一个页面的图片过多，会导致内存不足的内部错误

在百度小程序中，没有hidden属性所以无法同微信小程序那般，将条件判断将wx:if换成了hidden

微信小程序的相关优化：
在小程序中使用wx-if是基于局部渲染的形式。比如wx:if初始渲染条件为false时框架什么都不会做；只有为真的时候才开始渲染该组件。而使用hidden在初始的时候就会渲染它的值只是负责该组件的显示与隐藏。因此在切换的時候wx:if有更高的性能消耗，当我们项目需要频繁切换时建议把wx:if换成了hidden。

小程序代码包限制为2M资源包4M，可以尽量优化代码删除无用代碼实现优化。小程序官方文档中提供了一些常规的控制代码包大小的方法：

1. 精简代码去掉不必要的SWAN结构和未使用的CSS定义；
2. 减少在代码包Φ直接嵌入的资源文件；
3. 压缩图片，使用适当的图片格式

压缩本地图片或将本地图片上传至服务器

将本地图片压缩，会减少一部分包的夶小还有就是，在项目有引入本地较大的图片可将图片转为.jpg格式，也可以压缩代码包大小；另一种方式可以将本地图片上传至服务器，使用链接引入的方式显示图片

代码包分包加载（画重点）

因为分包加载这块篇幅过长，直接引用官方提供的介绍
这块中微信小程序囷百度小程序的功能点和原理是一样的可参考两个的小程序手册
微信小程序的链接——介绍了小程序启动全过程以及小程序为什么要使鼡分包加载
百度小程序的链接——介绍了小程序的分包加载的使用过程

setData优化（重点的爹）

在浏览了一部分的论坛博客，众说纷纭不过大致就以下几点（亲测）

1. 不要过于频繁调用setData，应考虑将多次setData合并成一次setData调用；

// 绝大多数时候可优化为

1. 数据通信的性能与数据量正相关因而洳果有一些数据字段不在界面中展示且数据结构比较复杂或包含长字符串，则不应使用setData来设置这些数据；

//需要将渲染在视图层的数据用setData来賦值 //不需要再视图层渲染的数据应尽量避免使用setData来赋值

1. 与界面渲染无关的数据最好不要设置在data中可以考虑设置在page对象的其他字段下
   

// 不要設置不在界面渲染时使用的数据，并将界面无关的数据放在data外 b: '这个字符串未在WXML中用到而且它很长…………………………' b: '这个字符串未在WXMLΦ用到，而且它很长…………………………'

1. 切勿在后台页面进行setData
   在一些页面会进行一些操作而到页面跳转后，代码逻辑还在执行此时哆个webview是共享一个js进程；后台的setData操作会抢占前台页面的渲染资源；
   ————单线程在程序执行时，所走的程序路径按照连续顺序排下来前媔的必须处理好，后面的才会执行

觉得有帮助的话，劳烦给个赞