CODEWITHSUNDEEP
javascriptthree.js
Gold
Gold

Reputation: 189

How to save a loaded model in three.js?

I'm doing a videogame and I have problems of memory, namely I load in my game 8 obj models but I repeat them, so this means that every time I need to add the same model in different position of the map I have done:

new THREE.MTLLoader().setPath( './Tree/' ).load( 'untitled.mtl', function ( materials ) {
     materials.preload();
     new THREE.OBJLoader().setMaterials( materials ).setPath( './Tree/' ).load( 'tree.obj', function ( object ) {
        object.scale.set(2, 2, 2);
        object.position.set(10, 0, 30);
        scene.add( object );
     }, undefined, undefined );
});

In this way, every time I call this, I istanciate the same object in memory and I need to much memory. Is there any way for saving only one copy in memory and every time I need it I call just this copy?

I have seeked online but I didn't find/understand any solution.

Upvotes: 0

Views: 374

Answers (1)

Mugen87
Mugen87

Reputation: 31046

Instead of loading the object multiple times you could clone it via Object3D.clone(). However, this is not an ideal solution for your use case since you still have multiple objects in memory and draw each object with a single draw call.

It's better to rendering object like trees with instanced rendering or to merge the final objects into a single one. In this way, you eventually have a single object in memory and also draw all trees with a single draw call (which is good for performance). Working with both approaches might need some preparation so it's best to study the official examples:

https://threejs.org/examples/webgl_buffergeometry_instancing https://threejs.org/examples/webgl_geometry_minecraft (geometries are merged in this example via BufferGeometryUtils.mergeBufferGeometries)

three.js R105

Upvotes: 1

Related Questions