用途
Flutter Performance 是一个面向 Flutter 应用性能优化的技能,用于解决应用运行中的性能瓶颈,目标是实现流畅的 60fps 渲染。它覆盖 Widget 重建优化、内存管理、渲染性能以及使用 DevTools 进行性能分析等方向。
适用场景
当出现以下情况时可以使用该技能:
- 应用掉帧或感觉卡顿
- 内存占用过高或存在内存泄漏
- 启动时间缓慢
- 列表滚动效率低下
- 构建时间过长
- 图片加载性能问题
- 需要进行性能分析与基准测试
主要能力
1. Widget 重建优化
避免不必要的 Widget 重建。推荐使用 const 构造函数,例如将 Column 声明为 const Column;也可以提取静态 Widget,将不随状态变化的组件定义为 static const 成员,减少重复构建。
2. 高效列表渲染
避免一次性创建全部子项。使用 ListView.builder 实现懒加载,或使用 ListView.separated 配合 const 分隔符,以提升长列表的滚动性能。
3. 图片优化
使用 CachedNetworkImage 缓存网络图片,并通过 memCacheWidth、memCacheHeight 在内存中调整尺寸;使用 precacheImage 预加载图片;根据场景选择合适格式,如 WebP 用于更好的压缩,SVG 用于可缩放图形(flutter_svg 包)。
4. 内存管理
在 dispose 中释放控制器与订阅,例如 ScrollController.dispose() 和 StreamSubscription.cancel(),避免内存泄漏。
5. 使用 RepaintBoundary
将开销较大的 Widget 与父级重建隔离,例如包裹动画组件或 CustomPaint,减少不必要的重绘。
6. 异步操作
使用 compute 处理重计算,例如解析大量 JSON;使用 Isolate.run 执行长时间运行的任务,避免阻塞主线程。
使用方式
该技能以最佳实践与代码示例的形式提供指导,核心实践包括:
- 尽可能使用 const 构造函数
- 在自定义画笔中实现 shouldRebuild
- 为列表项合理使用 keys
- 避免重建整个 Widget 树
- 优化前先用 DevTools 进行性能分析
- 懒加载数据与 Widget
- 缓存网络图片
- 正确释放资源
- 长列表使用 ListView.builder
- 缩小 setState 的作用范围
性能分析方面,可通过以下命令运行性能模式并使用 DevTools:
flutter run --profile
flutter pub global activate devtools
flutter pub global run devtools
也可在应用内开启性能叠加层:
MaterialApp(
showPerformanceOverlay: true,
// ...
)
限制
资料未提供该技能的安装方式、收费模式、支持平台及具体版本要求等信息,暂未提供。