鸿蒙（HarmonyOS）性能优化实战-减少动画丢帧

往期知识点整理

• 鸿蒙（HarmonyOS）北向开发知识点记录~
• 鸿蒙（HarmonyOS）应用开发之性能优化实战-组件复用
• 鸿蒙（HarmonyOS）应用性能优化实战-组件复用四板斧
• 鸿蒙（HarmonyOS）应用开发性能优化实战-WaterFlow高性能开发
• 鸿蒙（HarmonyOS）性能优化实战-Swiper高性能开发
• 鸿蒙（HarmonyOS）性能优化实战-合理使用renderGroup
• 鸿蒙（HarmonyOS）性能优化实战-减少动画丢帧
• 持续更新中……

在播放动画或者生成动画时，画面产生停滞而导致帧率过低的现象，称为动画丢帧。

播放动画时，系统需要在一个刷新周期内完成动画变化曲线的计算，完成组件布局绘制等操作。建议使用系统提供的动画接口，只需设置曲线类型、终点位置、时长等信息，就能够满足常用的动画功能，减少UI主线程的负载。

反例：应用使用了自定义动画，动画曲线计算过程很容易引起UI线程高负载，易导致丢帧。

@Entry
@Component
struct AttrAnimationExample0 {
   
  @State widthSize: number = 200
  @State heightSize: number = 100
  @State flag: boolean = true

  computeSize() {
   
    let duration = 2000
    let period = 16
    let widthSizeEnd = 0
    let heightSizeEnd = 0
    if (this.flag) {
   
      widthSizeEnd = 100
      heightSizeEnd = 50
    } else {
   
      widthSizeEnd = 200
      heightSizeEnd = 100
    }
    let doTimes = duration / period
    let deltaHeight = (heightSizeEnd - this.heightSize) / doTimes
    let deltaWeight