鸿蒙（HarmonyOS）性能优化实战-多板块性能提升方案

最新推荐文章于 2025-05-12 11:17:03 发布

原创

最新推荐文章于 2025-05-12 11:17:03 发布 · 897 阅读

24 ·

CC 4.0 BY-SA版权

文章标签：

#harmonyos #华为 #性能优化 #鸿蒙开发 #移动开发 #懒加载 #图形渲染

往期知识点整理

开发者若使用低性能的代码实现功能场景可能不会影响应用的正常运行，但却会对应用的性能造成负面影响。本章节列举出了一些可提升性能的场景供开发者参考，以避免应用实现上带来的性能劣化。

使用数据懒加载

开发者在使用长列表时，如果直接采用循环渲染方式，如下所示，会一次性加载所有的列表元素，一方面会导致页面启动时间过长，影响用户体验，另一方面也会增加服务器的压力和流量，加重系统负担。

@Entry
@Component
struct MyComponent {
   
   
  @State arr: number[] = Array.from(Array<number>(100), (v:number,k:number) =>k);  //构造0-99的数组
  build() {
   
   
    List() {
   
   
      ForEach(this.arr, (item: number) => {
   
   
        ListItem() {
   
   
          Text(`item value: ${
     
     item}`)
        }
      }, (item: number) => item.toString())
    }
  }
}

上述代码会在页面加载时将100个列表元素全部加载，这并非我们需要的，我们希望从数据源中按需迭代加载数据并创建相应组件，因此需要使用数据懒加载，如下所示：

class BasicDataSource implements IDataSource {
   
   
  private listeners: DataChangeListener[] = [];
  private originDataArray: string[] = [];

  public totalCount(): number {
   
   
    return 0;
  }

  public getData(index: number): string {
   
   
    return this.originDataArray[index];
  }

  registerDataChangeListener(listener: DataChangeListener): void {
   
   
    if (this.listeners.indexOf(listener) < 0) {
   
   
      console.info('add listener');
      this.listeners.push(listener);
    }
  }

  unregisterDataChangeListener(listener: DataChangeListener): void {
   
   
    const pos = this.listeners.indexOf(listener);
    if (pos >= 0) {
   
   
      console.info('remove listener');
      this.listeners.splice(pos, 1);
    }
  }

  notifyDataReload(): void {
   
   
    this.listeners.forEach(listener => {
   
   
      listener.onDataReloaded();
    })
  }

  notifyDataAdd(index: number): void {
   
   
    this.listeners.forEach(listener => {
   
   
      listener.onDataAdd(index);
    })
  }

  notifyDataChange(index: number): void {
   
   
    this.listeners.forEach(listener => {
   
   
      listener.onDataChange(index);
    })
  }

  notifyDataDelete(index: number): void {
   
   
    this.listeners.forEach(listener => {
   
   
      listener.onDataDelete(index);
    })
  }

  notifyDataMove(from: number, to: number): void {
   
   
    this.listeners.forEach(listener => {
   
   
      listener.onDataMove(from, to);
    })
  }
}

class MyDataSource extends BasicDataSource {
   
   
  private dataArray: string[] = ['item value: 0', 'item value: 1', 'item value: 2'];

  public totalCount(): number {
   
   
    return this.dataArray.length;
  }

  public getData(index: number): stri

最低0.47元/天解锁文章