Learning Compute shaders in tsl

this inspector??

can you show any example?

Go to the Chrome Web Store and download this extension:

Open up a Three.js or WebGPU project in your browser. Inspect the page with your Chrome Dev Tools, and select WebGPU Inspector from the Dev Tool extended options.

Within the WebGPU Inspector, click start. This will reload the WebGPU project within your browser and begin monitoring all the resources it is using. Within the Shader Modules tab under Objects, you’ll be able to see the shaders that were generated from your example:

3 Likes

If you want to use the GPU to speed up some calculations you can use webgl1/2, here’s an article I run into on the webgl2fundamentals site:

WebGL2 GPGPU

If you want compute shaders in the “normal” sense, then WebGPU is your best bet.

Here’s a tutorial on how to use TSL to write code for a WebGPU compute shader:

Interactive Galaxy with WebGPU Compute Shaders | Three.js Roadmap

1 Like