往期知识点整理
- 鸿蒙(HarmonyOS)北向开发知识点记录~
- 鸿蒙(HarmonyOS)应用开发之性能优化实战-组件复用
- 鸿蒙(HarmonyOS)应用性能优化实战-组件复用四板斧
- 鸿蒙(HarmonyOS)应用开发性能优化实战-WaterFlow高性能开发
- 鸿蒙(HarmonyOS)性能优化实战-Swiper高性能开发
- 持续更新中……
背景
在应用开发中,Swiper 组件常用于翻页场景,比如:桌面、图库等应用。Swiper 组件滑动切换页面时,基于按需加载原则通常会在下一个页面将要显示时才对该页面进行加载和布局绘制,这个过程包括:
-
如果该页面使用了@Component 装饰的自定义组件,那么自定义组件的 build 函数会被执行并创建内部的 UI 组件;
-
如果使用了 LazyForEach ,会执行 LazyForEach 的 UI 生成函数生成 UI 组件;
-
在 UI 组件构建完成后,会对 UI 组件进行布局测算和绘制。
针对复杂页面场景,该过程可能会持续较长时间,导致滑动过程中出现卡顿,对滑动体验造成负面影响,甚至成为整个应用的性能瓶颈。如在图库大图浏览场景中,若不使用预加载机制,每次都将在滑动开始的首帧去加载下一张图片,会导致首帧耗时过长甚至掉帧,拖慢应用性能。
为了解决上述问题,可以使用 Swiper 组件的预加载机制,利用主线程的空闲时间来提前构建和布局绘制组件,优化滑动体验。
使用场景
如果开发者的应用场景属于加载较为耗时的场景时,尤其是下列场景,推荐使用 Swiper 预加载功能。
-
Swiper 的子组件大于等于五个;
-
Swiper 的子组件具有复杂的动画;
-
Swiper 的子组件加载时需要执行网络请求等耗时操