THREE.JS / FOUNDATIONS 207

Scale is a contract.

The official Rapier instancing example renders 400 boxes and 400 spheres. This route makes that batch boundary measurable: change the instance count, rebuild the indexed rigid-body arrays, and compare shared-buffer cost with the renderer's live frame work.

Initializing Preparing renderer

Preparing a shared geometry batch and indexed Rapier body arrays...

physics
-
instances
-
draws
-
buffer
-
build ms
-
render ms
-
selected
-
fps
-
Batch controlsbox #1

Select an instance to inspect the indexed body and the shared matrix buffer that renders it.

Batch contractofficial API boundary
new THREE.InstancedMesh(..., count)allocate a bounded batch
DynamicDrawUsagedeclare per-frame matrix updates
physics.addMesh(mesh, mass, restitution)create indexed bodies
body[] + collider[]one array entry per instance
instanceMatrix.needsUpdatepublish the physics writeback
renderer.info.render.callsobserve draw-call work
RapierPhysics private timeraddon-owned 60 Hz step loop
physics.removeMesh(...)replace a batch safely

The batch size is a resource decision, not only a visual decision. This lab measures the Three.js render path and buffer footprint; the Rapier wrapper's internal timer remains private, so its step cost is reported as an ownership limitation rather than fabricated as a renderer metric.

Selected instancelive
group-
index-
position-
velocity-
bodies-

Rapier is loading. The selected instance will expose one member of the indexed body/collider arrays.

Based on the official Rapier instancing example, InstancedMesh docs, and RapierPhysics docs. Measurements are local browser evidence, not a universal performance claim.

THREE.JS FOUNDATIONS LAB