Freeing memory of ThreeJS application

Viewed 1202

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

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

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
Related