流畅的用户体验是每一个app都必须保证的问题，flutter 开发中如果动不动就setState，整屏刷新无疑会造成影响到用户的正常使用。所以我们需要寻找一切可以提高app性能和流程体验的方法，下面总结出了一些常用的优化方法。

一、重建检测方法

可以用随机颜色来判断哪些组件经过重建。

extension ColorExt on Color{
  ///随机颜色
  static Color get random {
    return Color.fromRGBO(
        Random().nextInt(256),
        Random().nextInt(256),
        Random().nextInt(256), 1);
  }
}

二、组件优化

1、类组件取代函数组件

建议用 StatefulBuilder/Builder；

2、利用字符串模板插值

3、缓存复用

1）、尽可能使用 const
2）、AutomaticKeepAlive
3）、用变量保存，为 nil 裁重新渲染，空等运算符是不错的方式

4、懒加载

1）、重复容器或者列表通过判断单个item是否在屏幕内或者将要进入屏幕位置而进行绘制。
    使用 ListView.builder、PageView.builder、GridView.builder

2）、一次性渲染容器 Column、Row、SingleChildScrollView
3）、如果列表支持增删，建议子组件加key

5、局部重建

1）、RepaintBoundary，如果图像足够复杂，Flutter 引擎会自动将其缓存，避免重复刷新。当然，因为缓存资源有限，如果引擎认为图像不够复杂，也可能会忽RepaintBoundary。
2）、Provider
3）、ChangeNotifier
4）、ValueNotifier
5）、少用或者只在局部使用 setState（StatefulBuilder）
6）、分帧渲染 keframe
7）、使用 Builder系列组件时，使用 child 可以缓存不用更新的部分

6、图片

1）、预渲染 precacheImage
2）、缓存 CachedNetworkImageProvider 等

 3）、耗时计算，放到 Isolate、compute
 
 Future<String> loadString(String key, { bool cache = true }) async {
    final ByteData data = await load(key);
    if (data == null)
      throw FlutterError('Unable to load asset: $key');
    if (data.lengthInBytes < 10 * 1024) {
      return utf8.decode(data.buffer.asUint8List());
    }
    return compute(_utf8decode, data, debugLabel: 'UTF8 decode for "$key"');
  }
 
  static String _utf8decode(ByteData data) {
    return utf8.decode(data.buffer.asUint8List());
  }

三、监听/订阅

所有监听，订阅都应该及时的取消；如果需要多次监听或订阅，在再次监听之前取消是一种不错的方式；

四、其他

新的数据结构，Protobuf

最后

性能调优是一种长期的任务，我们应该学会用官方提供的工具进行自检自查，不断找出问题和解决问题新的办法。