v150 · WebGPU

WebGPU Immediates

Pass small amounts of frequently-changing data directly to GPU shaders via setImmediateData() — without creating buffer objects or bind groups. The web's exposure of GPU hardware push constants.

concepts

  1. Push Constants Basics

    The simplest possible immediates demo: pass a single floating-point value (a time offset) directly to a fragment shader using setImmediateData(). No buffer creation, no bind group — one call per frame.

  2. Colour Animation

    Pass an RGBA colour as four floats via immediates each frame. Sliders control the colour in real time — every change goes straight to the shader through setImmediateData() with zero allocation overhead.

  3. Transform Uniforms

    Pass a 2D translation, rotation, and scale to a vertex shader as immediate data. Drag to translate, pinch to scale, or use the sliders — each frame ships the 4-float transform without touching any GPU memory objects.

  4. Performance Comparison

    Side-by-side: identical animated triangles, one using setImmediateData() and one writing to a GPUBuffer each frame. Frame time and allocation count are logged to show the immediates advantage for hot per-draw data.

  5. Compute Immediates

    Uses computePassEncoder.setImmediateData() — the compute-pass sibling of the render-pass API. Waveform parameters (frequency, amplitude, shape) are pushed directly to a compute dispatch that fills a storage buffer; a render pass reads the buffer to draw the waveform.

  6. Per-Draw Materials

    Six shapes drawn in a single render pass with six separate draw calls. Before each draw, setImmediateData() sets a material ID and a selected flag — no bind group swap, no buffer write. Click a shape to highlight it and watch the immediate change drive the shader.

why it shipped

GPU hardware has long supported "push constants" — a tiny, fast path for passing small values (a transform, a colour, a material index) directly to a shader without touching memory. Every native GPU API exposes this: pushConstants in Vulkan, root constants in D3D12, setVertexBytes/setFragmentBytes in Metal. WebGPU's initial design omitted them in favour of uniform buffers, which require allocation and may trigger re-binding. For per-draw parameters that change every frame, the buffer overhead is significant. WebGPU Immediates adds setImmediateData() to render passes, compute passes, and render bundle encoders, exposing the native push-constant mechanism and enabling the same high-performance pattern that game engines and graphics-heavy apps rely on in native code.

references

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗