erichlof / THREE.js-PathTracing-Renderer

Real-time PathTracing with global illumination and progressive rendering, all on top of the Three.js WebGL framework. Click here for Live Demo: https://erichlof.github.io/THREE.js-PathTracing-Renderer/Geometry_Showcase.html
Creative Commons Zero v1.0 Universal
1.88k stars 171 forks source link

WebGPU port #61

Open LeviPesin opened 2 years ago

LeviPesin commented 2 years ago

Hello!

Thank you for creating such an amazing renderer!

Can you try to port it to WebGPU (three.js's WebGPURenderer), please? I think it can significantly speed up the rendering (maybe then the examples would run on 30-60 fps even on my laptop, who knows!). Unfortunately, WebGPU is not very widely supported yet (it is supported in the latest versions of Chrome, Firefox, and etc but only behind a flag)...

The port would be much appreciated!

erichlof commented 2 years ago

Hello @LeviPesin !

Thank you for the kind words. I'm glad you are enjoying the renderer and I hope you are finding it useful. About porting it to WebGPU, yes I agree that it would be a worthwhile effort. From what I can tell so far, WebGPU can offer more low-level optimized support that allows us to target features of more modern GPUs. And since all of my path tracing shaders/demos rely heavily on the parallel-compute power of the GPU, it makes sense to eventually tap into this new API.

As you mentioned though, it is a very new API under active development and frequent changes, so unfortunately, developing with it is sort of like a moving target right now. I have been watching WebGPU from its inception, and I'm hoping that it becomes more stable in the near future. Once it is more fleshed out and the kinks are worked out, I will tackle the new shading language first, as that is where I am most comfortable (currently GLSL), and the that's where the heart of this renderer lies.

I'm hoping that as the dust starts to settle that some early adopters will make some tutorial blogs/YouTube videos about using WebGPU. I'm a visual learner so I hope someone out there is planning on doing a tutorial (like the abundant ones we have for WebGL and GLSL today). That plus looking at three.js' WebGPU examples source code would be the fastest way for me to get up to speed with this new API.

Thanks for the suggestion and it is something that is definitely on my radar and that I would like to have done someday. Also, if someone out there reading this thread knows WebGPU well already, they are more than welcome to take my current GLSL code and do a PR for a new WebGPU github branch for this repo!

-Erich

LeviPesin commented 2 years ago

Thank you! I will try to port the renderer to WGSL (and the three.js' NodeMaterial system which, unfortunately, lacks any documentation but is required in WebGPURenderer).

LeviPesin commented 2 years ago

Actually, it is even possible to port the renderer almost entirely to the three.js' Nodes system - three.js can automatically convert it to the GLSL or WGSL...