# Learn WebGPU (for native graphics in C++)

[LearnWebGPU](https://eliemichel.github.io/LearnWebGPU/) is a book-length guide to building native 3D applications in C++ against the [WebGPU](https://www.w3.org/TR/webgpu) API, targeting Windows, Linux and macOS. Despite the name, running in a browser is the side case here: the main body of the guide builds desktop binaries, and there is an appendix that adds the few extra lines needed to make the same examples run on the web. It is written by Élie Michel, who also maintains the [WebGPU-distribution](https://github.com/eliemichel/WebGPU-distribution) packaging the guide builds against.

## What it covers

The spine is a from-scratch progression. *Getting Started* opens a window and puts a colour on it, going through project setup, requesting an adapter and a device, the command queue, and the C++ wrapper. *Basic 3D Rendering* runs from Hello Triangle through input geometry (vertex buffers, multiple attributes, index buffers, loading from file), shader uniforms including dynamic ones, 3D meshes with a depth buffer and transformation and projection matrices, texturing with samplers, interaction (window resizing, camera control, a GUI, lighting control), and lighting and material work — specularity and normal mapping finished, image-based lighting, cube maps and physically-based materials still in progress.

*Basic Compute* is smaller and covers the compute pipeline, image processing (mipmap generation and convolution filters are written; cubemap conversion and prefiltering are not), procedural geometry, and a neural networks chapter that exists only as a placeholder. *Advanced Techniques* is mostly placeholders — RAII, headless contexts and timing benchmarks are written, while deferred shading, render bundles, multi-sampling, scene trees, shadow maps, tessellation, instanced drawing and raytracing are listed as TODO. The appendices carry the parts that do not fit the progression: building for the web, using SDL instead of the default window management, custom extensions for both backends, debugging, a memory model chapter, and two essays — *Teaching native graphics in 2023* and *Keep in mind lower-end devices*.

## How it is structured

Three structural choices do most of the work.

Every page carries a *Resulting code* link at both its start and its end, so a reader can join at any chapter without having typed the preceding ones. The guide's own quick-start advises exactly that for people who want to skip boilerplate, and recommends starting from the end of the *Lighting control* chapter if what you want is a 3D mesh viewer with basic interaction to build on.

Code blocks come in two tabs, "With webgpu.hpp" and "Vanilla webgpu.h". The first is a shallow C++ wrapper, the second the raw C API, and switching the tab switches every code block in the guide. The vanilla *Resulting code* repository lags behind, but the inline vanilla blocks are kept current, so the raw-C path is viable if you would rather not adopt the wrapper.

Chapter titles carry a maturity marker, which matters because the guide is unfinished and the WebGPU standard is still moving underneath it. 🟢 means the chapter matches the latest stable WebGPU-distribution (`v0.2.0`); 🟡 means readable but written against an older WebGPU; 🟠 is incomplete; 🔴 is a title with nothing behind it. Most of *Getting Started* and the early rendering chapters are green, most of the 3D and texturing chapters are yellow, and the advanced section is mostly red. The guide also warns to use the exact `webgpu/` version shipped with a chapter's accompanying code rather than mixing versions, and hides a *Next* section previewing the future rewrite, explicitly not stable.

The backend is a build-time choice rather than a chapter: `-DWEBGPU_BACKEND=WGPU` selects [wgpu-native](https://github.com/gfx-rs/wgpu-native) and is the default, `-DWEBGPU_BACKEND=DAWN` selects [Dawn](https://dawn.googlesource.com/dawn/). Both are covered in the custom-extensions appendix.

## Where it fits

WebGPU as a native graphics API is the modern half of the choice [[so-you-want-to-make-a-game-engine|lisyarus lays out]] for anyone writing their own engine: a 3D engine needs meshes, affine transforms, lighting and skeletal animation, which in practice means OpenGL, Vulkan, Direct3D or WebGPU underneath. His own engine, psemek, wraps OpenGL 3.3 and now WebGPU. Against [[learn-opengl]], which teaches core-profile OpenGL and is the older and more complete resource, LearnWebGPU is the one that gets you a browser target for free — see its *Building for the Web* appendix and [[webassembly]] — at the cost of tracking a standard that is still changing and a guide that says so on every chapter heading.