Three.js and WebGPU

mrdoob

WebGPU will land this year

Another transition...

CanvasRenderer anyone?

new THREE.WebGPURenderer()

Goal:

const renderer = new THREE.WebGLRenderer();
👇
const renderer = new THREE.WebGPURenderer();

However...

Different Shading Languages

  WebGL 👉 GLSL

WebGPU 👉 WGSL

The end of
material.onBeforeCompile()

NodeMaterial to the rescue (WIP)

Thanks Sunag!

Node Editor

MaterialX

https://materialx.org/

MaterialXLoader

https://materialx.org/

NodeToy

https://nodetoy.co/

Thanks!

https://threejs.org