STYLEGALLERY / STUDIESCODE + CURIOSITY / 21INDEPENDENT EXAMPLE

21 / Instancing & measured rendering work

Same orchard. Fewer calls.

An original orchard of geometric columns shares one geometry and one material. Switch the submission method, then change resolution separately. Read what the renderer actually submitted.

THE PROCEDURAL ORCHARDONE MATERIAL / SHARED GEOMETRY
Draw calls
Triangles
Buffer pixels
Switch modes to collect a second observation.
What this study teaches

A deterministic array of original column transforms feeds either separate Three.js Mesh objects or one InstancedMesh. A single render reports renderer.info draw calls and triangles, while the drawing buffer reports actual pixel dimensions. Object count, DPR and scheduling are separate controls; no frame-rate or universal speedup claim is made.

Independent implementation informed by “Building Efficient Three.js Scenes: Optimize Performance While Maintaining Quality”, Niccolò Fanton, Codrops. This is newly authored code and artwork, not a recovered original project. The original source remains acquired/MIT. Its original scene still lacks a complete runnable asset set, including 87 path-specific redistribution gaps retained by the source packet. This original geometric orchard uses no original models, scene arrangement, brands, image textures or withheld assets. Measurements cover one opaque, depth-tested material and one render pass. DOM labels are outside the measured 3D scene. Instancing does not imply that arbitrary different textures and materials become one call. Changing object count or DPR changes workload or image quality. Pixel count is not a measurement of GPU time or a proportional speedup.