Quiz

// ============================================================
// Q1) What units does three.js use?
// ============================================================
// ANSWER: dimensionless. By convention treat 1 unit = 1 metre — physics,
//   lighting falloff, camera near/far all behave correctly at that scale.
//   Switch only with intention; documents that mix "1 unit = 1 cm" and
//   "1 unit = 1 m" make models look 10× too dark or too bright.

// ============================================================
// Q2) Why does my scene look washed out / wrong colour?
// ============================================================
// ANSWER: Default renderer colour space is linear, but you usually
//   want sRGB for output. Set it once at startup:
renderer.outputColorSpace = THREE.SRGBColorSpace;
renderer.toneMapping      = THREE.ACESFilmicToneMapping;
// Textures imported from PNG/JPG are sRGB; assign tex.colorSpace = SRGBColorSpace.

// ============================================================
// Q3) Why does my MeshStandardMaterial look black until I add lights?
// ============================================================
// ANSWER: MeshStandardMaterial is physically-based; without light it
//   has nothing to reflect. Either add a light (AmbientLight + DirectionalLight)
//   or use MeshBasicMaterial for unlit displays.

// ============================================================
// Q4) What is the difference between camera.lookAt() and OrbitControls?
// ============================================================
// ANSWER: lookAt() orients the camera once. OrbitControls listens to pointer
//   events and recomputes every frame. You almost always update controls
//   inside the animation loop: controls.update();

// ============================================================
// Q5) Why does raycaster.intersectObjects() miss children?
// ============================================================
// ANSWER: The recursive flag defaults to FALSE on intersectObject() but
//   TRUE on intersectObjects(...). For nested GLTFs and Groups, pass true:
raycaster.intersectObjects(scene.children, true);

// ============================================================
// Q6) How do I cleanly dispose of resources when removing a mesh?
// ============================================================
// ANSWER: scene.remove() unlinks but does not free GPU memory.
mesh.geometry.dispose();
mesh.material.dispose();        // dispose textures if you own them
scene.remove(mesh);

// ============================================================
// Q7) Why is my SkinnedMesh / GLB animating but not moving?
// ============================================================
// ANSWER: You probably forgot to call mixer.update(dt) in the render loop.
//   const mixer = new THREE.AnimationMixer(model);
//   mixer.clipAction(clip).play();
//   renderer.setAnimationLoop((time) => {
//     mixer.update((time - last) / 1000); last = time;
//     renderer.render(scene, camera);
//   });

// ============================================================
// Q8) Why is performance dying on mobile?
// ============================================================
// ANSWER: usually one of:
//   - Pixel ratio too high (cap at 2): renderer.setPixelRatio(Math.min(devicePixelRatio, 2));
//   - Shadow maps too large: light.shadow.mapSize.set(512, 512);
//   - Too many materials (each is a draw call): merge geometries / instance them
//   - Post-processing on a full-screen quad — drop it on mobile

// Scoring guide
// 8 / 8 -> teach the team
// 6 / 8 -> ready for production
// < 6   -> read the three.js docs on Color Management, then revisit

// 3 questions per lesson.