渲染性能

提高渲染性能

性能评估chevron_right提高渲染性能

info提示

了解如何使用 性能视图（Flutter DevTools 的一部分）进行性能问题排查，请查看 使用性能视图 (Performance view)。

在衡量性能时，应用程序中的渲染动画一直是最受关注的话题之一。由于 Flutter 自带的 Skia 引擎以及它能够快速创建和处理组件的能力， Flutter 应用在默认情况下就能保证拥有良好的性能，因此我们只需避开常见的陷阱就可以获得出色的性能。

一些基本的建议

#

如果看到不稳定（不流畅）的动画，请 确保 你正在做性能分析的应用是在 profile 模式下构建的，因为默认情况下 Flutter 会在 debug 模式下创建应用，这并不表示应用正式发布后的性能。更多信息，参见 Flutter 的构建模式。

有几种常见的陷阱：

• 每帧重建的 UI 比预期的要多得多。要跟踪组件的重建，请参阅 显示性能数据。
• 直接构建大量的子组件列表，而不使用 ListView。

有关评估性能的更多资料（包括常见缺陷），请参阅以下文档：

• Flutter 应用性能优化最佳实践
• Flutter 性能分析

纯移动应用

#

如果移动应用里遇到一些肉眼可见的卡顿，单只是在第一次运行动画的时候？如果是这样的话，可以查看这个文档 减少过移动应用的着色器动画卡顿。

纯 Web 应用

#

下面的内容是 Flutter Material 团队在提高 Flutter Gallery Web 应用性能时候总结的经验：

• 通过 tree shaking 和延迟加载来优化 Flutter Web 应用的性能 (Optimizing performance in Flutter web apps with tree shaking and deferred loading)
• 通过使用图像占位符、预缓存和禁用导航效果来提高性能(Improving perceived performance with image placeholders, precaching, and disabled navigation transitions)
• 高效构建 Flutter widgets (Building performant Flutter widgets)