HarmonyOS(60)性能优化之状态管理最佳实践

1、避免在循环中访问状态变量

在应用开发中，应避免在循环逻辑中频繁读取状态变量，而是应该放在循环外面读取

1.1 反例

@Entry
@Component
struct Index {
  @State message: string = '';

  build() {
    Column() {
      Button('点击打印日志')
        .onClick(() => {
          for (let i = 0; i < 10; i++) {
            //循环体中使用message
            hilog.info(0x0000, 'TAG', '%{public}s', this.message);
          }
        })
        .width('90%')
        .backgroundColor(Color.Blue)
        .fontColor(Color.White)
        .margin({
          top: 10
        })
    }
  }
}

1.2 正例

将上述代码改成如下，在for循环外部定义一个局部变量，然后在for循环内部使用该变量。

@Entry
@Component
struct Index {
  @State message: string = '';

  build() {
    Column() {
      Button('点击打印日志')
        .onClick(() => {
          //循环体外提前访问message变量
          let logMessage: string = this.message;
          for (let i = 0; i < 10; i++) {
            hilog.info(0x0000, 'TAG', '%{public}s', logMessage);
          }
        })
        .width('90%')
        .backgroundColor(Color.Blue)
        .fontColor(Color.White)
        .margin({
          top: 10
        })
    }
  }
}

2、避免不必要的状态变量的使用

• 没有关联任何UI组件的状态变量不应该定义为状态变量，否则读写状态变量都会影响性能。
• 仅有读取操作，没有修改过，没有修改过的状态变量不应该定义为状态变量，否则读状态变量会影响性能。

总之没有关联任何UI组件的状态变量和没有修改过的状态变量不应该定义为状态变量，直接使用一般变量即可，否则会影响性能。

3、建议使用临时变量替换状态变量

状态变量发生变化时，ArkUI会查询依赖该状态变量的组件并执行依赖该状态变量的组件的更新方法，完成组件渲染的行为。通过使用临时变量的计算代替直接操作状态变量，可以使ArkUI仅在最后一次状态变量变更时查询并渲染组件，减少不必要的行为，从而提高应用性能。

3.1 反例

 @State message: string = '';

  appendMsg(newMsg: string) {
    //直接操作状态变量，效率不高
    this.message += newMsg;
    this.message += ';';
    this.message += '<br/>';
  }

3.2 正例

 @State message: string = '';

 appendMsg(newMsg: string) {
    //创建一个临时变量，代替直接使用状态变量
    let message = this.message;
    message += newMsg;
    message += ';';
    message += '<br/>';
    this.message = message;
  }

4、参考资料

状态管理最佳实践
HarmonyOS(35) @State使用注意事项