# 资源加载优化

# 1. 控制图片资源的大小

开发者应根据功能需要和实际显示区域的大小，选择合适的图片尺寸、图片格式和压缩比。

图片体积太大，可能导致下列后果

• 增加图片下载时间，导致用户看到图片时机延迟；
• 对用户造成非必要的流量消耗；
• 影响图片解码和绘制的耗时，可能更容易造成掉帧、卡顿或白屏，甚至无法正常进行滚动和页面切换（低端设备上会尤为明显）；
• 内存占用增长，尤其是大图片和长列表中的大量图片会导致内存占用急剧上升。

图片对内存的影响

iOS 系统内存紧张时，会主动回收掉一部分 WebView。大图片和长列表中的大量图片很容易引起系统对 WebView 的回收，导致小程序白屏，严重时会触发微信强制关闭小程序。

内存增长如果超过了限制，也会导致小程序出现白屏或黑屏，甚至整个小程序发生闪退。

# 2. 避免滥用 image 组件的 widthFix/heightFix 模式

widthFix/heightFix 模式会在图片加载完成后，动态改变图片的高度或宽度。图片高度或宽度的动态改变，可能会引起页面内大范围的布局重排，导致页面发生抖动，并造成卡顿。

对于页面的背景图或 banner 图，应尽量预先指定图片的尺寸，避免图片加载完成后再进行二次的尺寸调整。