webgpu-compute-rasterizer icon indicating copy to clipboard operation
webgpu-compute-rasterizer copied to clipboard

A simple software rasterizer running on a WebGPU compute shader. Built for educational purposes.

WebGPU Compute Rasterizer

This is a basic implementation of a rasterizer running on WebGPU compute shaders. It currently supports loading a list of triangles from a (very basic) glTF model and rendering it, with shading based on each triangle's distance to the camera.

I built this to create a simple template for exploring compute-based rendering techniques. Initially inspired by Rendering Point Clouds with Compute Shaders and Vertex Order Optimization.

See:

  • How to Build a Compute Rasterizer with WebGPU for a step by step guide on building your own version of this.
  • Or Code Overview for a brief walkthrough of the code & implementation.

Building locally

Run npm install and npm run dev. Then open localhost:3000.

You must use a browser that supports WebGPU. See the setup instructions in this article.

Rust port

There is a Rust port of this article here: https://github.com/pudnax/compaster. Created by @pudnax.