WebGPU has three shader stages: vertex computes positions, fragment computes colors, compute runs a function N times

WebGPU exposes three programmable shader stages. A vertex shader computes vertices and returns vertex positions, run once per vertex to draw triangles, lines, or points. A fragment shader computes colors: for each pixel a primitive covers, the GPU calls it to return that pixel’s color. A compute shader is more generic — effectively a function you ask the GPU to execute N times in parallel over arbitrary data, not tied to drawing, reading and writing storage buffers instead of a framebuffer. Compute shaders are the substrate for GPU-accelerated simulation, image processing, ML inference, and generative content, which makes them central to real-time AI/AV work in the browser.

Examples

A particle system: a compute shader updates positions each frame; a vertex shader reads those positions to place sprites; a fragment shader colors each sprite. All three stages cooperate.

Assessment

For each of the three shader stages, name one task it does and one it cannot. Why use a compute shader rather than a vertex shader to process a block of audio samples?