Question

The Textured Box demo on http://www.khronos.org/webgl/wiki/Demo_Repository has the following code snippets:

function loadImageTexture(ctx, url)
{
    var texture = ctx.createTexture(); // allocate texture
    texture.image = new Image();
    texture.image.onload = function() 
                              { doLoadImageTexture(ctx, texture.image, texture) }
    texture.image.src = url;
    return texture;
}

function doLoadImageTexture(ctx, image, texture)
{
    ctx.bindTexture(ctx.TEXTURE_2D, texture);
    ctx.texImage2D(ctx.TEXTURE_2D, 0, ctx.RGBA, ctx.RGBA, ctx.UNSIGNED_BYTE, image);  // loaded the image
...
}
...

var spiritTexture = loadImageTexture(gl, "resources/spirit.jpg");
...

How do you free the allocated/loaded texture in order to avoid (graphics) memory leak?

Will the following code free both the loaded/allocated texture and image?

spiritTexture  = null;

Thanks in advance for your help.

NOTE: Cross post on http://www.khronos.org/message_boards/viewtopic.php?f=43&t=3367 on December 23, 2010 but no answer so far.

Answer 1

ctx.deleteTexture(spiritTexture);

That should free the texture on the gpu.

Regarding the image, you should just modify loadImageTexture so that it doesn’t store image inside texture. The reference to image is not needed outside loadImageTexture and you can let it go out of scope naturally when doLoadImageTexture completes.

i.e. make it something like:

function loadImageTexture(ctx, url)
{
    var texture = ctx.createTexture(); // allocate texture
    var image = new Image();
    image.onload = function() { doLoadImageTexture(ctx, image, texture) }
    image.src = url;
    return texture;
}