I've recently written about another compute heavy global illumination approach, which is all but impossible to pull off using WebGL: https://juretriglav.si/surfel-based-global-illumination-on-t...
After this experiment (and some that are in progress), and some very recent movement on raising the bound storage buffer limit in Chrome (https://issues.chromium.org/issues/366151398), I can't help but feel that we're on the cusp of an AAA-level experience built exclusively on the web. I'm super excited for the future of computer graphics right in your browser.
If you have a good GPU the default parameters underutilize it. This demo lets you crank up the "samples per pixel" parameter to get good quality in real time: https://erichlof.github.io/THREE.js-PathTracing-Renderer/Mul...
The demos I tried so far have translate and not pan, and those are fully 3d…
Particularly cool is the recreation of that classic scene from Kajiya's rendering equation paper, with the glass spheres and caustics.
https://github.com/gkjohnson/three-gpu-pathtracer
Demos here:
https://gkjohnson.github.io/three-gpu-pathtracer/example/bun...
This one is also an official Three.js example:
https://threejs.org/examples/?q=path#webgl_renderer_pathtrac...
One common misconception is that ray tracing is computationally prohibitive. It was, but no longer so; it's a target within our reach, especially so when there's GPU with hardware acceleration for ray casting.
Many games use ray tracing for partial scene processing, and of course they all work in real time. My favourite example is Metro Exodus with ray traced global illumination, which works on last gen graphics hardware pretty well. Not all games use the technology efficiently, but the trend is already obvious: with accessible real time ray tracing rendering the scene will become a much easier task.
P.S. I used "ray tracing" when more accurately I should have used "path tracing", but I prefer to use a single term to encompass the whole technology with all its variants.