使用性能视图 (Performance view)

备忘

性能视图仅适用于移动应用。对于 web 应用程序，请使用 Chrome 自带的开发者工具进行 性能分析

它是什么?

性能视图可以记录并分析 Dart 应用程序的性能，以帮助我们找到应用程序的性能瓶颈。

备忘

对于 Flutter 应用程序，需要使用 profile 构建模式才能使用性能分析 如果你希望你的 Flutter 应用程序性能与 Release 模式下相同且希望使用性能分析工具，请使用 Profile 模式。

CPU 分析器

单击 Record 开始进行记录 CPU 信息，完成后点击 Stop 停止记录，CPU 分析器会把收集的信息推送到VM并分别在不同的信息窗口进行展示调用树 (Call Tree, Bottom Up, and Flame Chart).

分析粒度

VM 收集 CPU 样本的默认速率为 1/250μs (即每 250 微秒收集一次数据)。一般情况下，Profile granularity 的默认值为 “medium”。可以通过页面顶部下拉列表进行修改。抽样率低、中、高粒度分别顺序对应 1/50μs、1/250μs 和 1/1000μs。正确设定此值对性能分析非常重要。

高粒度 的配置会具有更高效的采样率，因此单元时间内采集的 CPU 信息会更加详细且采集样例更多。因些 VM 会被经常中断以收集样本数据，所以这有可能会影响你的应用程序的运行或导致性能下降。VM 中 CPU 样例数据信息的存储空间是受限制的，所以也会导致 VM 的 CPU 示例缓冲区很快地填充满且会产生溢出。相对低采样率，高采样率存储空间会被迅速填满并会出现溢出。一旦空间溢出，就有可能导致采样数据丢失。

低粒度 的配置具有较低的采样率，因此单元时间内采集的 CPU 信息会比较粗略且采集样例较少。当然，这样也会对你的应用程序性能影响更小。VM 示例缓冲区填充速度也会较慢，因此你可以采集到相当长一段时间内应用程序的 CPU 样例数据。这也意味着你有更好的机会去查看 CPU 样例数据。

火焰图表

火焰图选项卡主要用于显示一段持续时间内 CPU 的样本信息。图表展示的是自上而下的调用堆栈信息，即上面的堆栈帧调用下面的堆栈帧。每一个堆栈帧的宽度代表 CPU 执行的时长。栈帧消耗 CPU 的时间越长，就越洽有可能是我们进行性能改进的好地方。

Screenshot of a flame chart

调用树(也叫跟踪树)

调用树视图是一种自上而下展示 CPU 中的调用堆栈信息方法。在下图中的表格中可以看出，展开其中的一个方法可以查看它所有的调用者。

  • 总时间

  • 此方法运行的总时间，包括了调用者的执行时间(即调用此方法整个的生命周期时长)。

  • 自执行时间

  • 仅表示执行当前方法把花费的时长。
  • 方法
  • 调用的方法名称。
  • 源码
  • 方法所在的文件路径。

Screenshot of a call tree table

自下而上

Bottom up 视图也是用于显示方法调用堆栈，但顾名思义，它是一个自下而上的表示方式。这意味着表格中的每个最上方的方法实际上是给定 CPU 样本的调用堆栈中的最后一个方法(换句话说，这是样本的叶节点)。

在这张表中，可以展开一个方法查看它的所有调用过程。

  • 总时间

  • 此方法运行的总时间，包括了调用者的执行时间(即调用此方法整个的生命周期时长)。

  • 自执行时间

  • 在 Bottom up 调用树中对于最顶层的方法(叶堆栈帧)，它表示执行自己的代码所需要的时间。对于子节点(调用者)，它表示调用者运行被调用者的时间。在下面的这个例子中，调用者 Element.updateSlotForChild.visit() 的执行时间等于被调用者 [Stub] OneArgCheckInLineCache 的执行时间。

  • 方法

  • 调用方法的名称。
  • 源码
  • 方法所在的文件路径。Screenshot of a bottom up table