100,000 rentals, three ways
Seeded positions and a fixed 300 × 150 canvas, so the counts are the same on every run and screen.
Design a 3D view of a lot of data, such as 100,000 bike rentals on a city map: draw them in one call (points or instancing), pick with the GPU or a spatial index, label only what matters, stream tiles, and know when a 2D map is the better answer.
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.
Colour each rental by its hour of the day in the instanced version, without adding draw calls.
Hide every rental outside a time range chosen on a slider, without rebuilding any buffer.
Explain it without notes
How would you draw and pick 100,000 items in a browser?
When would you advise against a 3D data view?
Console
Nothing logged yet.Expected console output
Points draw calls 1 | triangles 0 | points 100000 | vertex data 1.1 MiB
InstancedMesh of spheres draw calls 1 | triangles 8000000 | points 0 | vertex data 6.1 MiB
1,000 separate meshes draw calls 955 | triangles 76400