Freeing memory of ThreeJS application

I am currently having issues with freeing memory in my ThreeJS application.

I am aware there are already several questions about this problem:

• freeing memory in three.js
• Freeing memory with threejs
• Three.js Collada - What's the proper way to dispose() and release memory (garbage collection)?

I do dispose my objects using the following Typescript function I've made :

function dispose( object3D: THREE.Object3D ): void {     // Dispose children first     for ( let childIndex = 0; childIndex < object3D.children.length; ++childIndex )     {         this.dispose( object3D.children[childIndex] );     }      object3D.children = [];      if ( object3D instanceof THREE.Mesh )     {         // Geometry         object3D.geometry.dispose();          // Material(s)         if ( object3D.material instanceof THREE.MultiMaterial )         {             for ( let matIndex = 0; matIndex < object3D.material.materials.length; ++matIndex )             {                 object3D.material.materials[matIndex].dispose();                 object3D.material.materials[matIndex] = null;             }             object3D.material.materials = [];         }          if ( object3D.material.dispose )         {             object3D.material.dispose();             object3D.material = null;         }     }      // Remove from parent     if ( object3D.parent )         object3D.parent.remove( object3D );      object3D = null; } 

However, when I do heap snapshots using Chrome Dev Tools, I still have tons and tons of :

• Arrays
• Vector2 (uvs in __directGeometry , ... )
• Vector3 (vertices in geometry, normal in faces, vertexColors in faces, ...)
• Face3 (faces in geometry)
• Color (colors in __directGeometry, ...)
• JSArrayBufferData (color, normal, in attributes of geometry, ...)

Because of all the data in memory, my application gets killed by Jetsam on iOS, see : Jetsam kills WebGL application on iOS

I suspect some data inside the library is not freed up when I ask it to.

1 Answers

Answers 1

Try to dispose just everything. I'm using this snippet for a while. It disposes materials, textures, 3d objects. It iterates over arrays and plain objects.

let dispose = function(o) {     try {         if (o && typeof o === 'object') {             if (Array.isArray(o)) {                 o.forEach(dispose);             } else             if (o instanceof THREE.Object3D) {                 dispose(o.geometry);                 dispose(o.material);                 if (o.parent) {                     o.parent.remove(o);                 }                 dispose(o.children);             } else             if (o instanceof THREE.Geometry) {                 o.dispose();             } else             if (o instanceof THREE.Material) {                 o.dispose();                 dispose(o.materials);                 dispose(o.map);                 dispose(o.lightMap);                 dispose(o.bumpMap);                 dispose(o.normalMap);                 dispose(o.specularMap);                 dispose(o.envMap);             } else             if (typeof o.dispose === 'function') {                 o.dispose();             } else {                 for (let [key, value] of o) {                     dispose(value);                 }             }         }     } catch (error) {         console.log(error);     } }; 

If You Enjoyed This, Take 5 Seconds To Share It

• Facebook
• Twitter
• Google+
• StumbleUpon
• Digg
• Delicious
• LinkedIn
• Reddit
• Technorati