three.js icon indicating copy to clipboard operation
three.js copied to clipboard

WebGPURenderer: Tree shaking Materials - WIP

Open sunag opened this issue 1 year ago • 3 comments

Introduce

The objective of the PR is to advance the tree shaking of WebGPURenderer related to Materials, any suggestions and opinions regarding the notes below are welcome.

Design

WebGPURenderer tree shaking NodeMaterials is very simple, the same does not happen with other library-based Material abstractions such as MeshStandardMaterial, these materials depend on their shader base being accessed in the Renderer.

image

I created jsm/renderers/webgpu/Three.js to have a version similar to the core related to WebGPURenderer and three shaking.

The code below shows the two examples related to the image mentioned above:

WebGLRenderer - Core https://github.com/sunag/three.js/blob/dev-materials/src/materials/MeshStandardMaterial.js

WebGPURenderer - Core https://github.com/sunag/three.js/blob/dev-materials/examples/jsm/materials/MeshStandardMaterial.js

The main difference is that we have some added setup*() calls and extends NodeMaterial.

Thoughts

  • Structure Material class to support the creation of shader using TSL and preserve the previous hierarchy regarding default materials.
  • We would no longer need the Node prefix in materials since it can be unified easily.

Examples

webgpu_lights_selective

/cc @mrdoob @Mugen87

sunag avatar May 10 '24 07:05 sunag