Every built-in shape, counted
Open the status bar: 7 draw calls. The first frame is drawn solid, then again as wireframe, so the console shows both counts.
three.js ships ready-made shapes: box, sphere, cylinder, torus, plane, capsule and tube. Each is a grid of vertices joined into triangles, and the segment numbers you pass decide how round it looks and how many triangles it costs.
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.
Build a CylinderGeometry for a bike tube with radius 0.02 and length 0.5, with 8 sides. Print its triangle count, then predict what 16 sides gives and check.
You need a bell for the bike: a dome. Which built-in shape would you start from, and how would you cut it in half?
Explain it without notes
Why does the default sphere have 960 triangles but only 561 vertices?
A shape is missing from your scene and there is no error. Name three geometry-side things you would check.
Console
Nothing logged yet.Expected console output
BoxGeometry 24 vertices 12 triangles
SphereGeometry 561 vertices 960 triangles
CylinderGeometry 196 vertices 128 triangles
TorusGeometry 637 vertices 1152 triangles
PlaneGeometry 4 vertices 2 triangles
CapsuleGeometry 90 vertices 144 triangles
TubeGeometry 585 vertices 1024 triangles
solid frame: 7 draw calls, 3422 triangles (column total 3422)
wireframe frame: 0 triangles, 10266 lines