Summary

Using models from external sources isn’t that hard to do in Three.js, especially for simple models—you only have to take a few easy steps.

When working with external models, or creating them using grouping and merging, it is good to keep a couple of things in mind. The first thing you need to remember is that when you group objects, they remain available as individual objects. Transformations applied to the parent also affect the children, but you can still transform the children individually. Besides grouping, you can also merge geometries together. With this approach, you lose the individual geometries and get a single new geometry. This is especially useful when you’re dealing with thousands of geometries you need to render and you’re running into performance issues. The final approach if you want to control a large number of meshes of the same geometry is to use a THREE.InstancedMesh object or a THREE.InstancedBufferGeometry object, which...