brendan-duncan / webgpu_inspector

Inspection debugger for WebGPU
MIT License
161 stars 4 forks source link

Web Worker support #8

Closed csnewman closed 4 months ago

csnewman commented 4 months ago

https://webgpu.github.io/webgpu-samples/sample/worker/

Currently the extension can't intercept WebGPU running inside a web worker, such as via transferControlToOffscreen. This technique is often used to reduce jank on the UI thread and therefore would be useful to support.

brendan-duncan commented 4 months ago

I've been trying to figure out how I might be able to do that, but haven't figured it out yet. Injecting a script into the DOM from an extension content script is not too hard, but I have no idea how to do that for a worker script yet. One possibility would be to manually import the inspector script in the worker script. I don't think Spector.js ever figured out how to do this automatically for web workers either.

I'll at least make sure manually importing the script works, while I continue trying to figure out how to automatically inject it.

csnewman commented 4 months ago

Manually importing the script seems a reasonable middle ground. I'm also unaware of an easy way to inject the script

brendan-duncan commented 4 months ago

First attempt at inspecting a worker thread. Example: https://github.com/brendan-duncan/webgpu_inspector/blob/main/test/worker.html https://github.com/brendan-duncan/webgpu_inspector/blob/main/test/webgpu_worker.js

In webgpu_worker.js, I import webgpuInspector from the CDN hosted webgpu_inspector.js path. Then I call webgpuInspector.captureWorker(canvas); with the offscreen canvas to make sure it can capture its textures.

In worker.html, I load webgpuInspectorWorker from the CDN hosted webgpu_inspector_worker.js path, and call webgpuInspectorWorker(worker); with the worker object. This is only sometimes necessary, based on the order the browser loads the scripts. You can always just do this, but if the script that creates the worker is in an external js, then you probably don't actually need to do it because I try and capture newly created Workers. It's usually embedded scripts, like in this example, that run before the injected inspector script starts running.

With that setup, I can use the WebGPU Inspector devtools panel as usual. I think the only thing I found not working yet is capturing specific frames.

csnewman commented 4 months ago

Closing due to #10