ARTICLE DETAIL

资讯详情

深耕网站视觉设计与运营推广的一线实战洞察。

如何用 Instruments 与 FlameGraph 工具为 iOS/macOS 上的 Flutter 应用生成火焰图

如何用 Instruments 与 FlameGraph 工具为 iOS/macOS 上的 Flutter 应用生成火焰图 如何用 Instruments 与 FlameGraph 工具为 iOS/macOS 上的 Flutter 应用生成火焰图【免费下载链接】flutterFlutter makes it easy and fast to build beautiful apps for mobile and beyond项目地址: https://gitcode.com/GitHub_Trending/flutter41/flutter当你需要分析一个跑在 iOS/macOS 上的 Flutter 应用的性能热点时火焰图Flame Graph提供了一种查看聚合性能数据的方式。完整的操作路径是先用 Xcode 自带的 InstrumentsTime Profiler 模板捕获 CPU profile 数据再用外部的FlameGraph命令行工具把剪贴板中的 profile 内容转换成 HTML 火焰图。适用于本地编译引擎或预构建引擎local or prebuilt engines。Flutter 官方文档同时提醒这条流程相比 Android Studio 一侧要janky一些必须借助外部工具火焰图本身并不是 Xcode 的一部分。准备条件安装 Mint 与 FlameGraph 工具火焰图转换依赖FlameGraphSwift 命令行工具。官方示例使用 Mint 这个 Swift 包管理器来安装它也可以自行通过 Swift Package Manager 在本地构建如果你已经完成过下面步骤可以跳过本节。用 Homebrew 安装 Mintbrew install mint然后把 Mint 的bin目录加入 PATH。下面的示例假设你的 shell 配置文件.rc文件是.profile如果你的环境不是这样请按实际调整后再执行echo export PATH$PATH:$HOME/.mint/bin ~/.profile source ~/.profile通过 Mint 安装 FlameGraphmint install lennet/FlameGraph安装完成后命令行的FlameGraph命令即可直接调用这是后文转换步骤的前置依赖。用 Instruments 捕获 Profile 数据打开 Xcode 的 Instruments选择Time Profiler模板对目标 Flutter 应用进行 profile点击红色的圆点开始录制录到你认为足够多的 profile 数据后按停止键结束这次 trace。在结果中选中你要调查的线程——对 Flutter 应用而言这里关注的是io.flutter.raster线程。注意官方文档的强调一定要选中 trace root。选中之后用键盘快捷键⇧⌘C复制该 trace或者通过菜单 Edit - Deep Copy 完成复制。这一步把 profile 内容放进了剪贴板是 FlameGraph 工具的数据来源。把 Profile 转换为火焰图在命令行执行FlameGraph --html output.html这条命令会把剪贴板中刚才复制的 profile 内容转换成 HTML 格式。执行后系统会自动打开一个新的浏览器标签页展示火焰图——这就是本流程的验证方式如果你能在浏览器中看到火焰图说明整条链路Instruments 复制 → 剪贴板 → FlameGraph 转换已经跑通。文档同时提示火焰图可能需要缩放zoom之后才便于阅读。边界与限制本文流程针对iOS/macOS平台生成火焰图官方文档明确指出其操作过程比 Android Studio 一侧更依赖外部工具这不是 Xcode 的内置能力。PATH配置示例以.profile为假设实际文件按你的 shell 环境调整否则FlameGraph命令在后续步骤中不可用。FlameGraph --html output.html读取的是剪贴板内容必须在完成 Instruments 的 Deep Copy 之后执行否则没有可供转换的数据。如果浏览器中打开的火焰图能正常展示io.flutter.raster线程上的调用栈本次火焰图生成即完成后续的性能优化分析就可以基于这份 HTML 火焰图展开。完整流程可参照 iOS CPU Profiling 文档。【免费下载链接】flutterFlutter makes it easy and fast to build beautiful apps for mobile and beyond项目地址: https://gitcode.com/GitHub_Trending/flutter41/flutter创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表