使用应用大小工具

它是什么？

应用大小工具允许您分析应用的总大小。您可以使用 分析选项卡 查看“大小信息”的单个快照，或使用 差异选项卡 比较“大小信息”的两个不同快照。

什么是“大小信息”？

“大小信息”包含应用程序的 Dart 代码、本机代码和非代码元素（例如应用程序包、资产和字体）的大小数据。“大小信息”文件包含应用程序大小的总体数据。

Dart 大小信息

Dart AOT 编译器在编译应用程序时对代码执行树摇动（仅限于个人资料或发布模式——AOT 编译器不用于调试版本，调试版本是 JIT 编译的）。这意味着编译器尝试通过移除未使用的或不可达的代码片段来优化应用程序的大小。

在编译器尽可能优化代码后，最终结果可以总结为二进制输出中存在的包、库、类和函数的集合，以及它们的大小（以字节为单位）。这是“大小信息”的 Dart 部分，我们可以在应用程序大小工具中对其进行分析，以进一步优化 Dart 代码并追踪大小问题。

如何使用

如果 DevTools 已连接到正在运行的应用程序，请导航到“应用程序大小”选项卡。

如果 DevTools 未连接到正在运行的应用程序，则可以在启动 DevTools 后显示的着陆页中访问该工具（请参阅安装说明）。

分析选项卡

分析选项卡允许你检查大小信息的单个快照。你可以使用树状图和表格查看大小数据的层次结构，并且可以使用支配树和调用图查看代码归因数据（例如，为什么将代码片段包含在已编译应用程序中）。

加载大小文件

当你打开“分析”选项卡时，你将看到加载应用程序大小文件的说明。将应用程序大小文件拖放到对话框中，然后单击“分析大小”。

有关生成大小文件的详细信息，请参阅下面的生成大小文件。

树状图和表格

树状图和表格显示应用程序大小的层次数据。

使用树状图

树状图是用于分层数据的可视化工具。该空间被分割为矩形，其中每个矩形的尺寸和顺序由某个定量变量（在本例中为字节大小）确定。每个矩形的面积与该节点在已编译应用程序中所占的大小成正比。在每个矩形（称为 A）内部，还有其他矩形，它们在数据层次结构中存在更深一层（A 的子级）。

要深入了解树状图中的一个单元格，请选择该单元格。这会重新设置树的根，以便所选单元格成为树状图的可视根。

要返回或向上移动一层，请使用树状图顶部的面包屑导航器。

支配树和调用图

此页面部分显示代码大小归因数据（例如，为什么将一段代码包含在已编译的应用程序中）。此数据以支配树和调用图的形式显示。

使用支配树

支配树是一个树，其中每个节点的子级都是它直接支配的节点。如果从 b 到 a 的每条路径都必须经过 a，则称节点 a “支配”节点 b。

为了将其置于应用大小分析的上下文中，假设 package:a 同时导入了 package:b 和 package:c，而 package:b 和 package:c 都导入了 package:d。

package:a
|__ package:b
|   |__ package:d
|__ package:c
    |__ package:d

在此示例中，package:a 支配 package:d，因此此数据的支配树将如下所示

package:a
|__ package:b
|__ package:c
|__ package:d

此信息有助于理解为什么某些代码段会出现在已编译的应用程序中。例如，如果你正在分析应用大小并发现已编译的应用中包含了一个意外的软件包，则可以使用支配树来追踪该软件包的根源。

使用调用图

调用图提供的信息与支配树类似，它有助于理解为什么代码存在于已编译的应用程序中。但是，调用图不会像支配树那样显示代码大小数据节点之间的一对多支配关系，而是显示代码大小数据节点之间多对多的关系。

同样，使用以下示例

package:a
|__ package:b
|   |__ package:d
|__ package:c
    |__ package:d

此数据的调用图将链接 package:d 到其直接调用方 package:b 和 package:c，而不是其“支配者” package:a。

package:a --> package:b -->
                              package:d
package:a --> package:c -->

此信息有助于了解代码（包、库、类、函数）之间的细粒度依赖关系。

我应该使用支配树还是调用图？

如果您想了解将代码片段包含在应用程序中的根本原因，请使用支配树。如果您想了解进出代码片段的所有调用路径，请使用调用图。

支配树是对调用图数据的分析或切片，其中节点通过“支配”而不是父子层次结构进行连接。在父节点支配子节点的情况下，调用图和支配树中的关系将相同，但并非总是如此。

在调用图完整（每个节点对之间存在边）的情况下，支配树将显示 root 是图中每个节点的支配者。这是一个示例，其中调用图将让您更好地了解将代码片段包含在应用程序中的原因。

Diff 标签

Diff 标签允许您比较两个大小信息的快照。您正在比较的两个大小信息文件应从同一应用程序的两个不同版本生成；例如，在对代码进行更改之前和之后生成的大小文件。您可以使用树状图和表格可视化两个数据集之间的差异。

加载大小文件

当您打开Diff 标签时，您将看到加载“旧”和“新”大小文件的说明。同样，这些文件需要从同一应用程序生成。将这些文件拖放到各自的对话框中，然后单击分析 Diff。

请参阅以下 生成大小文件，了解如何生成这些文件。

树状图和表格

在 diff 视图中，树状图和树形表格仅显示两个导入的大小文件之间不同的数据。

有关使用树状图的问题，请参阅上面的 使用树状图。

生成大小文件

要使用应用大小工具，您需要生成一个 Flutter 大小分析文件。此文件包含整个应用程序（本机代码、Dart 代码、资产、字体等）的大小信息，您可以使用 --analyze-size 标志生成此文件

flutter build <your target platform> --analyze-size

这将构建您的应用程序，将大小摘要打印到命令行，并打印一行告诉您在哪里可以找到大小分析文件。

flutter build apk --analyze-size --target-platform=android-arm64
...
▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒
app-release.apk (total compressed)                               6 MB
...
▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒
A summary of your APK analysis can be found at: build/apk-code-size-analysis_01.json

在此示例中，将 build/apk-code-size-analysis_01.json 文件导入到应用大小工具中以进行进一步分析。有关更多信息，请参阅 应用大小文档。

其他资源

要了解如何使用 DevTools 对 Wonderous App 执行分步大小分析，请查看 应用大小工具教程。还讨论了减小应用大小的各种策略。