Basic example for Gaussian Splats in WebGPU

This web page demonstrates rendering a 3D model in WebGPU using Gaussian Splats as an alternative to regular triangles. Splats are localised fuzzy volumes that are sorted and rendered from back to front. They have the advantage of being differentiable unlike conventional triangle-based 3D models, which makes them attractive for machine learning. This demo creates a simple human figure with aa shadow, where the splats are associated with normals and material properties for PBR-based lighting. A radix sort with a Hillis-Steele scan is used on desktop computers and a cheaper binning sort is used on mobile devices. Use the cursor left and right keys to rotate the camera around the scene, cursor up and down keys to change the camera's height. On mobile devices touch-drag left/right, up/down. On laptops, use two finger drags.

Log:
 

The figure is generated using stochastic splatting. A more regular tiling would produce a smoother surface and could be generated by a neural network using a sequence of 2D images. Note that the binning sort for mobile devices trades speed against a slight popping effect. This demo shows that it will be hard to get the desired performance on mobile devices without reducing the splat count.