[Impeller] Add docs to detail RenderDoc frame captures (flutter#36815)

ndusart · Oct 17, 2022 · 5c10a44 · 5c10a44
1 parent 5357f81
commit 5c10a44
Show file tree

Hide file tree

Showing 5 changed files with 30 additions and 0 deletions.
diff --git a/ci/licenses_golden/licenses_flutter b/ci/licenses_golden/licenses_flutter
@@ -1131,6 +1131,7 @@ FILE: ../../../flutter/impeller/display_list/nine_patch_converter.cc
 FILE: ../../../flutter/impeller/display_list/nine_patch_converter.h
 FILE: ../../../flutter/impeller/display_list/vertices_converter.cc
 FILE: ../../../flutter/impeller/display_list/vertices_converter.h
+FILE: ../../../flutter/impeller/docs/assets/launch-app.png
 FILE: ../../../flutter/impeller/docs/assets/read_frame_captures/image1.png
 FILE: ../../../flutter/impeller/docs/assets/read_frame_captures/image10.png
 FILE: ../../../flutter/impeller/docs/assets/read_frame_captures/image11.png
@@ -1149,6 +1150,7 @@ FILE: ../../../flutter/impeller/docs/assets/read_frame_captures/image6.png
 FILE: ../../../flutter/impeller/docs/assets/read_frame_captures/image7.png
 FILE: ../../../flutter/impeller/docs/assets/read_frame_captures/image8.png
 FILE: ../../../flutter/impeller/docs/assets/read_frame_captures/image9.png
+FILE: ../../../flutter/impeller/docs/assets/render-doc-capture.png
 FILE: ../../../flutter/impeller/docs/assets/shader_pipeline.png
 FILE: ../../../flutter/impeller/docs/assets/showcase.png
 FILE: ../../../flutter/impeller/docs/assets/xcode_frame_capture/image1.png

diff --git a/impeller/README.md b/impeller/README.md
@@ -182,6 +182,7 @@ To your `AndroidManifest.xml` file, add under the `<application>` tag:
 * [Frequently Asked Questions](docs/faq.md)
 * [Impellers Coordinate System](docs/coordinate_system.md)
 * [How to Setup Xcode for GPU Frame Captures with Metal.](docs/xcode_frame_capture.md)
+* [How to Setup RenderDoc Frame Captures with Vulkan.](docs/renderdoc_frame_capture.md)
 * [Learning to Read GPU Frame Captures](docs/read_frame_captures.md)
 * [How to Enable Metal Validation for Command Line Apps.](docs/metal_validation.md)
 * [How Impeller Works Around The Lack of Uniform Buffers in Open GL ES 2.0.](docs/ubo_gles2.md)

diff --git a/impeller/docs/assets/launch-app.png b/impeller/docs/assets/launch-app.png
diff --git a/impeller/docs/assets/render-doc-capture.png b/impeller/docs/assets/render-doc-capture.png
diff --git a/impeller/docs/renderdoc_frame_capture.md b/impeller/docs/renderdoc_frame_capture.md
@@ -0,0 +1,27 @@
+# Frame Capture with RenderDoc
+
+[RenderDoc](https://renderdoc.org/) is a graphics debugger that can be used to capture frames. With Impeller starting to support gles and Vulkan backends, RenderDoc can provide insights into the application's frames.
+
+1. First step is to setup RenderDoc. Follow the instructions [here](https://renderdoc.org/docs/getting_started/quick_start.html). For the purposes of this guide it is assumed that you are able to get RenderDoc running.
+2. The next step would be to run the application you wish the capture the frames of. Typically these would be one of the playground tests. To build these, do:
+
+```bash
+# In your $ENGINE_SRC folder, do:
+
+./flutter/tools/gn --unopt --no-lto --enable-impeller-playground\
+   --enable-impeller-vulkan --target-dir host_debug_impeller_vulkan
+autoninja -C out/host_debug_impeller_vulkan/
+```
+
+3. Start RenderDoc, and click the "Launch Application" button.
+
+<img src="assets/launch-app.png" height="200" />
+
+4. Fill out the following parameters, and click launch:
+  - executable: `$ENGINE_SRC/out/host_debug_impeller_vulkan/impeller_unittests` (expand `ENGINE_SRC`).
+  - args: `--gtest_filter="*CanDrawRect/Vulkan*"`
+  - working dir: `$ENGINE_SRC` (expand `ENGINE_SRC`)
+
+5. For the frame you wish to capture, press `F12`, you will now be able to see the frame capture and inspect the state.
+
+<img src="assets/render-doc-capture.png" />