How to use ImageBitmapLoader's .close() method

Questions
1

Looking at the ImageBitmap example, you have to call imagebitmap.close() to free the memory, as stated in this comment block:

ImageBitmap should be disposed of when done with it. Can't be done until it's actually uploaded to WebGLTexture.

How does my application know when the ImageBitmap is ready to be disposed? Am I stuck using something like using a setTimeout?

dummy3DObjs.forEach((e,i)=>{
    let loader = new THREE.ImageBitmapLoader()
    loader.setOptions( { imageOrientation: 'flipY' } );
    loader.load( srcs[i] , function ( imageBitmap ) {
        const texture = new THREE.CanvasTexture( imageBitmap );
        texture.colorSpace = THREE.SRGBColorSpace;
        texture.minFilter = THREE.LinearFilter
        texture.generateMipmaps  = false
        let mat  = new THREE.MeshBasicMaterial()
        let mesh = new THREE.Mesh(g,mat)
        mesh.position.copy(e.position.clone())
        mesh.material.map = texture
        /* ImageBitmap should be disposed when done with it
        Can't be done until it's actually uploaded to WebGLTexture */
        // imageBitmap.close();
        setTimeout(() => imageBitmap.close(), 1 ) //ugly
        group.add(mesh);
    }, function ( p ) {
        console.log( p );
    }, function ( e ) {
        console.log( e );
    } );
})
2

Try this:

texture.onUpdate = function() {

   imageBitmap.close();

};

onUpdate() is executed whenever a texture upload to the GPU has finished.

Using setTimeout() is indeed ugly since you might close the image bitmap before the texture upload happens.

1 Like
3

worked perfectly. thanks!