No WebGL at all: what the page and three.js see
The override affects only this page.
Never assume the visitor's browser can draw 3D. Ask it, in order: WebGPU if you want it, then WebGL 2, then show a still image with a text alternative. Each answer is a path, and every path must leave the page useful.
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 4 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Write supportsWebGL2() so it returns false instead of throwing when getContext itself throws.
Write the three lines that show a #fallback element with a reason and an alt text when the start fails.
Explain it without notes
Describe the order of checks for a page that prefers WebGPU, accepts WebGL 2 and has a still image. What can go wrong at each step?
Why does three.js r186 have no WebGL 1 fallback, and what does that change for your fallback design?
Console
Nothing logged yet.Expected console output
webgl2 context: null
webgl1 context: null
THREE.WebGLRenderer: THREE.WebGLRenderer: Error creating WebGL context.
three.js says: THREE.WebGLRenderer: Error creating WebGL context.