v144 · graphics

WebGPU: Uniform buffer standard layout

Functionality added to the WebGPU spec after its first shipment in a browser.

concepts

  1. Standard Layout

    An opt-in WebGPU feature that relaxes uniform buffer layout rules to match std140. Makes porting GLSL shaders to WGSL almost mechanical.

  2. vec3 Padding Trap

    Visualise the classic vec3 alignment trap byte-by-byte: old (std140-like padding) vs new (std layout, tight packing).

  3. Struct Calculator

    Paste a WGSL struct — the calculator lays out every field in 16-byte rows, marks padding bytes in red, reports total size under default vs standard layout.

  4. WGSL Struct Layout Calculator

    Build a WGSL struct field by field — add f32, vec3, mat4x4, and more — and compare the byte layout side-by-side: default layout vs uniform_buffer_standard_layout. See how much padding is eliminated.

why it shipped

This feature simplifies the use of uniform buffers in WGSL shaders by unifying their constraints with those of storage buffers. Without this, developers are required to align all array elements to 16 bytes and pad nested structures to achieve a 16-byte offset.

references