WGSL
Shaders · 4 stages · 28 units in the full series · 28 published in English
Series goal
Understand WGSL types, stage interfaces, address spaces, memory layout, and parallel control flow, and write verifiable kernels.
Prerequisites
WebGPU buffers and pipelines, vectors
Practice approach and scope
Learning units are not calendar days. Read the explanation and tasks, check the completion criteria, then move on. Use each example as a starting point: change variables and observe the results. Built-in examples and tasks requiring a separate environment are identified separately. Opening an example does not complete a unit.
Existing unit IDs and notes are preserved. The original 01, 02, and 03 examples occupy positions 1, 14, and 28 in the expanded sequence, so the number in the address may differ from the learning order.
Only published English units are linked below. The full series has 28 units.
Learning path
Stage 1 · Types and Shader Interfaces
- 01. Types and Entry Points — Editable example
- 02. Literals and Explicit Numeric Types — Editable example
- 03. Creating and Multiplying Vectors and Matrices — Editable example
- 04. Const, Let, Var, and Override — Editable example
- 05. Function and Structure Contracts — Editable example
- 06. Conditions, Loops, and Termination — Editable example
- 07. Interpolation and Stage Interfaces — Editable example
Stage 2 · Resource Declarations and Memory Layout
- 08. Address Spaces and Access Modes — Editable example
- 09. Groups, Bindings, and Host Connections — Editable example
- 10. Scalar and Vector Alignment — Editable example
- 11. Matrix and Array Strides — Editable example
- 12. Additional Uniform Layout Constraints — Editable example
- 13. Runtime Arrays and Binding Ranges — Editable example
- 14. Bindings and Memory Layout — Editable example
Stage 3 · Parallel Computation and Synchronization
- 15. Compute IDs and Indices — Editable example
- 16. Bounds Checks and Empty Input — Editable example
- 17. Workgroup Memory and Cooperation — Editable example
- 18. Barriers and Uniform Control Flow — Editable example
- 19. Atomics and Counters — Editable example
- 20. Partial-Sum Reduction — Editable example
- 21. Ping-pong and Data Races — Editable example
Stage 4 · Numeric Verification and Kernel Design
- 22. Stage Constraints on Texture Functions — Editable example
- 23. Storage Texture Output — Editable example
- 24. Numeric Stability and Special Inputs — Editable example
- 25. Kernel Tests and Sentinels — Editable example
- 26. Workgroup Configuration and Measurement — Editable example
- 27. Documenting Kernel Contracts — Editable example
- 28. Compute and Boundaries — Editable example
Capstone project and deliverables
A small compute collection that verifies bounds, layout, and synchronization, and a comparison report against CPU references
Keep the implementation, run instructions, baseline and changed conditions, failure cases, and recovery steps together. Do not report unmeasured performance or tests you have not run as results.