The cost of a shadow: passes and memory
The script counts how many times three.js draws into a shadow map. The point light does it six times. Draw calls stay 3 because the ball is in only one face of the cube.
A shadow is a second picture, drawn from the light's point of view, that stores how far the nearest surface is. Then every pixel asks: am I farther than that? You learn the five switches that must all be on, and fix the three classic faults: no shadow, a cut-off shadow and acne.
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 5 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
A shadow looks blocky. Name two fixes and the cost of each.
Write the lines for a directional key light at (2, 4, 3) that shadows a scene about 3 m across.
Explain it without notes
A mesh casts no shadow. Give the five checks in the order you would do them.
Why does a point light cost six times the memory of a directional light at the same mapSize?
Console
Nothing logged yet.Expected console output
light shadow passes draw calls memory (about 4 bytes a texel)
DirectionalLight 1 3 4 MiB
SpotLight 1 3 4 MiB
PointLight 6 3 24 MiB