资源加载优化
1. 控制图片资源的大小
开发者应根据功能需要和实际显示区域的大小,选择合适的图片尺寸、图片格式和压缩比。
图片体积太大,可能导致下列后果
- 增加图片下载时间,导致用户看到图片时机延迟;
- 对用户造成非必要的流量消耗;
- 影响图片解码和绘制的耗时,可能更容易造成掉帧、卡顿或白屏,甚至无法正常进行滚动和页面切换(低端设备上会尤为明显);
- 内存占用增长,尤其是大图片和长列表中的大量图片会导致内存占用急剧上升。
图片对内存的影响
内存增长如果超过了限制,会导致小程序出现白屏或黑屏,甚至整个小程序发生闪退。
2. 避免滥用 image 组件的 widthFix/heightFix 模式
widthFix/heightFix 模式会在图片加载完成后,动态改变图片的高度或宽度。图片高度或宽度的动态改变,可能会引起页面内大范围的布局重排,导致页面发生抖动,并造成卡顿。
对于页面的背景图或 banner 图,应尽量预先指定图片的尺寸,避免图片加载完成后再进行二次的尺寸调整。