Start, init, and ask which backend
No output is set because the line differs by browser. In a browser with WebGPU it prints backend: WebGPU and no warning. In the checker's browser it prints the fallback warning and backend: WebGL 2 (fallback). Look at the status bar under the canvas: it names the backend too.
WebGPURenderer from three/webgpu uses WebGPU when the browser has it and WebGL 2 when it does not, with the same code. It starts asynchronously, so you await renderer.init() before the first frame and read renderer.backend to see what you got.
Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.
Ready for more? This phase has 3 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Write a function createRenderer(container) that returns a started WebGPURenderer and logs the backend name. What must it be?
Using the first example, make a version that stays on WebGL 2 when the URL contains ?gl=1.
Explain it without notes
Why must you await renderer.init() with WebGPURenderer, and what happens if you do not?
A visitor reports the scene looks different in Firefox on Linux. What do you check first?
Console
Nothing logged yet.