使用性能视图

性能页面可以帮助您诊断应用程序中的性能问题和 UI 卡顿。此页面提供应用程序活动的时间和性能信息。它包含几个工具，可帮助您识别应用程序性能不佳的原因

• Flutter 帧图表（仅适用于 Flutter 应用程序）
• 帧分析选项卡（仅适用于 Flutter 应用程序）
• 时间线事件跟踪查看器（所有本机 Dart 应用程序）
• 高级调试工具（仅适用于 Flutter 应用程序）

性能视图还支持导入和导出数据快照。有关更多信息，请查看 导入和导出 部分。

Flutter 旨在以每秒 60 帧 (fps) 或在支持 120Hz 刷新的设备上以 120 fps 的速度渲染其 UI。每次渲染都称为一个帧。这意味着，大约每 16 毫秒，UI 会更新以反映动画或其他 UI 更改。渲染帧所需时间超过 16 毫秒会导致显示设备上的卡顿（抖动）。

此图表包含应用程序的 Flutter 帧信息。图表中的每个条形集合代表一个 Flutter 帧。这些条形会根据颜色编码，以突出显示渲染 Flutter 帧时发生的不同部分的工作：来自 UI 线程的工作和来自栅格化线程的工作。

此图表包含应用程序的 Flutter 帧时间信息。图表中的每对条形代表一个 Flutter 帧。从该图表中选择一个帧会更新下方 帧分析 选项卡或 时间线事件 选项卡中显示的数据。

当您的应用程序中绘制新帧时，Flutter 帧图表会更新。要暂停此图表的更新，请单击图表右侧的暂停按钮。可以通过单击图表上方的 Flutter 帧 按钮来折叠此图表，以提供更多用于下方数据的查看空间。

代表每个 Flutter 帧的条形对会根据颜色编码，以突出显示渲染 Flutter 帧时发生的不同部分的工作：来自 UI 线程的工作和来自栅格化线程的工作。

UI 线程在 Dart VM 中执行 Dart 代码。这包括来自您的应用程序以及 Flutter 框架的代码。当您的应用程序创建并显示场景时，UI 线程会创建一个层树，这是一个轻量级对象，包含设备无关的绘制命令，并将层树发送到栅格化线程以在设备上渲染。 不要 阻塞此线程。

栅格化线程执行来自 Flutter Engine 的图形代码。此线程获取层树并通过与 GPU（图形处理单元）通信来显示它。您无法直接访问栅格化线程或其数据，但如果此线程速度慢，则可能是由于您在 Dart 代码中所做的事情造成的。Skia 图形库在此线程上运行。Impeller 也使用此线程。

有时，一个场景会产生一个易于构建但栅格化线程渲染起来代价高昂的层树。在这种情况下，您需要弄清楚您的代码正在做什么导致渲染代码变慢。特定类型的工作负载对 GPU 来说更困难。它们可能涉及不必要的 saveLayer() 调用、具有多个对象的透明度交叉以及特定情况下的剪辑或阴影。

有关性能分析的更多信息，请查看 识别 GPU 图形中的问题。

帧渲染图表用红色覆盖显示卡顿。如果一个帧完成需要的时间超过 ~16 毫秒（对于 60 FPS 设备），则该帧被认为卡顿。要实现 60 FPS（每秒帧数）的帧渲染速率，每个帧必须在 ~16 毫秒或更短的时间内渲染。如果未达到此目标，您可能会遇到 UI 卡顿或丢帧。

有关如何分析应用程序性能的更多信息，请查看 Flutter 性能分析。

着色器编译发生在您的 Flutter 应用程序中首次使用着色器时。执行着色器编译的帧在深红色中标记

有关如何减少着色器编译卡顿的更多信息，请查看 减少移动设备上的着色器编译卡顿。

从 Flutter 帧图表上方选择一个卡顿帧（慢，以红色显示）会在帧分析选项卡中显示调试提示。这些提示可以帮助您诊断应用程序中的卡顿，并通知您我们检测到的任何可能导致慢帧时间的昂贵操作。

时间线事件图表显示应用程序中的所有事件跟踪。Flutter 框架在构建帧、绘制场景以及跟踪其他活动（例如 HTTP 请求时间和垃圾回收）时会发出时间线事件。这些事件会出现在时间线中。您还可以使用 dart:developer Timeline 和 TimelineTask API 发送您自己的时间线事件。

要了解如何导航和使用跟踪查看器，请单击时间线事件选项卡栏右上角的 ？ 按钮。要使用应用程序中的新事件刷新时间线，请单击刷新按钮（也在选项卡控件的右上角）。

要在时间线事件图表中查看更详细的跟踪，请使用增强跟踪下拉菜单中的选项

要查看新的时间线事件，请重现您感兴趣的应用程序中的活动，然后选择一个帧以检查时间线。

要在时间线中查看 build() 方法事件，请启用 跟踪 Widget 构建 选项。Widget 的名称显示在时间线事件中。

观看此视频以了解跟踪 Widget 构建的示例

要查看时间线中的渲染对象布局事件，请启用 跟踪布局 选项

观看此视频以了解跟踪布局的示例

要查看时间线中的渲染对象绘制事件，请启用 跟踪绘制 选项

观看此视频以了解跟踪绘制的示例

要诊断与渲染层相关的性能问题，请关闭渲染层。这些选项默认启用。

要查看对应用程序性能的影响，请重现应用程序中的活动。然后选择帧图表中新的帧以检查禁用层的时间线事件。如果栅格化时间显著减少，您禁用的效果的过度使用可能导致您在应用程序中看到的卡顿。

渲染剪辑层

禁用此选项以检查过度使用剪辑是否影响性能。如果禁用此选项后性能得到改善，请尝试减少应用程序中剪辑效果的使用。

渲染不透明度层

禁用此选项以检查过度使用不透明度效果是否影响性能。如果禁用此选项后性能得到改善，请尝试减少应用程序中不透明度效果的使用。

渲染物理形状层

禁用此选项以检查过度使用物理建模效果是否影响性能，例如阴影或高度。如果禁用此选项后性能得到改善，请尝试减少应用程序中物理建模效果的使用。

DevTools 支持导入和导出性能快照。单击导出按钮（帧渲染图表上方的右上角）会下载性能页面上当前数据的快照。要导入性能快照，您可以从任何页面将快照拖放到 DevTools 中。 请注意，DevTools 仅支持导入最初从 DevTools 导出的文件。

要了解如何使用 DevTools 监控应用程序的性能并检测卡顿，请查看引导式 性能视图教程。