The showroom after Phase 4 (files inlined)
This is src/objects/bike.js below, inlined into one example with Phase 3's showroom (the world modules are shrunk to a few lines because local imports cannot run here). Open the scene tree: turntable > stand, bike > five parts. The status bar shows 8 draw calls (the stand and seven tubes).
The bike gets the rear triangle of its frame: a pair of chain stays and a pair of seat stays, built from cylinders in bike.js, and the showroom now reports how many triangles the bike 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.
Add a console.log that prints each part's world position of its first child, using getWorldPosition.
Make the stays 20 percent thicker without editing two places.
Explain it without notes
Why is tubePair a function that returns a Group and not two separate bike.add lines?
Why do the stays copy the key points with clone()?
Console
Nothing logged yet.Expected console output
down-tube 64 triangles
top-tube 64 triangles
seat-tube 64 triangles
chain-stays 128 triangles
seat-stays 128 triangles
bike: 448 triangles