I was reviewing the examples for the webgpu renderer, now that chrome put out their news about releasing support for webgpu. It seems that most of the examples I saw make use of nodes. As someone used to making custom shader materials via GLSL how can I do something similar with the WebGPU renderer? I would also like to make use of compute shaders, as currently I just use a rendertarget swap for that in the webgl renderer for that kind of thing.
I would appreciate any guidance here for migration and how to think about this to get the benefits of webgpu, thank you!
When developing WebGPURenderer, the project used the opportunity to develop a new node-based material system. This system will make developing custom materials easier and more elegant since the current approach based on ShaderMaterial and RawShaderMaterial has many issues (e.g. using built-in shader chunks is complicated and fragile, there is no tree-shaking support for the internal shader lib, even for simple effects you have to write GLSL).
The new workflow will be similar to node-based systems that you know from other engines or 3D modeling tools. There will be a node editor that you can use to author custom materials, there will be full serialization/deserialization support and node definitions can be executed in potentially any native 3D backend (WebGPU, WebGL or something different in the future).
So the usual workflow would be to start with a built-in node material and then customize certain inputs (like the color input) with a custom node composition. You can see this workflow is basically every WebGPU example. The idea is to avoid to write shader code whenever possible so things like onBeforeCompile() or the knowledge of the internal shader library are not required anymore.
However, that does not mean the material system takes away the ability to write custom shaders. If you want to develop customized materials with plain WGSL (for whatever reasons), that will be possible. Next to this there will also be TSL (three.js shading language) which allows you to develop platform independent shader code with a more level approach compared to pure node compositions. Both approaches will be part of the node material system.
The example is not complete yet but webgpu_materials gives you an overview about what is already possible now. More examples and documentation are planned for the future.
webgpu_compute_particles_rain or webgpu_compute_particles demonstrates the current compute shader features. This will be ideal for all GPGPU related tasks that were previously implemented with custom render target pipelines or GPUComputationRenderer.