跳到主要内容

GPU 性能分析

本节介绍如何通过原生 GPU 性能工具捕获和分析 WebGL 或 WebGPU 帧，调试 GPU 操作并分析性能。

初步测量可使用 MiniStats，或通过 AppStats 启用 GPU 计时。原生工具用于进一步分析这些测量背后的渲染工作。

Web 应用通常运行在隔离环境中，与原生 GPU 分析工具的兼容和集成受到限制，因此这类分析在 Web 平台尤其困难。本页介绍部分平台上经过测试的方法。

Apple 芯片 macOS 上的 WebGPU 应用​

  • 克隆 WebKit：

    git clone https://github.com/WebKit/WebKit.git WebKit

  • 构建 MiniBrowser，约需 30 分钟：

    cd WebKit
    Tools/Scripts/build-webkit -cmakeargs="-DENABLE_WEBGPU_BY_DEFAULT=1" --release

  • 启动 MiniBrowser，并指定 Web 应用 URL：

    __XPC_METAL_CAPTURE_ENABLED=1 Tools/Scripts/run-minibrowser --release --url https://playcanvas.com/examples/

  • 在另一个命令行窗口中配置捕获帧数，默认为 1。

    notifyutil -s com.apple.WebKit.WebGPU.CaptureFrame 2

  • 在合适时机捕获帧：

    notifyutil -p com.apple.WebKit.WebGPU.CaptureFrame

    这会生成捕获文件，启动 MiniBrowser 的命令行窗口会输出路径，例如：

    Success starting GPU frame capture at path file:///var/folders/m3/cnrw6k214hxd0hq1rf7cy3w40000gn/T/com.apple.WebKit.GPU+org.webkit.MiniBrowser/8C9372EF-1254-4FC5-8CA9-730FB

  • 双击文件，在 Xcode 中打开，再点击对话框中的 Replay。随后可检查逐帧绘制调用、分析资源、调试着色器并收集性能指标。

    Xcode

Apple 芯片 macOS 上的 WebGL 应用​

上述步骤只支持捕获 WebGPU 应用。要捕获 WebGL，可以在同一页面嵌入一个小型 WebGPU 应用，通常捕获 2 到 3 帧。因为两者底层都使用 Metal API，捕获会同时包含 WebGPU 和 WebGL 工作。

PlayCanvas 应用可以使用现成脚本简化流程，只需将它附加到场景中的任意一个实体：

https://github.com/playcanvas/engine/blob/main/scripts/utils/mac-gpu-profiling.js

Windows 上的 WebGL 和 WebGPU 应用​

使用 Microsoft PIX 在 Chrome 中捕获 GPU 帧的方法见：https://toji.dev/webgpu-profiling/pix

也可以使用 RenderDoc，方法见：https://edw.is/renderdoc-webgl/

若希望在 Chrome 中使用 AMD Radeon GPU Profiler 或 NVIDIA Nsight，请参阅这篇文章。

Meta Quest 上的 WebGL 应用​

使用 Meta 的 RenderDoc 分支捕获 Quest 设备渲染的方法，见这篇文章。