Demonstrating sweat free movieclip creation and clean up in PIXI

pixi_mc.js

/*
    This snippet requires PIXI and underscoreJS to work;
    The good thing about this approach is that you don't have to manually set the number of total frames
    used and file name references used in the animation to build up your texture data; and this technique
    also makes it a lot easier to remove the BaseTextures from TextureCache once you no longer need them,
    so that you can free up precious memory!
    
    Use this snippet with caution, I quickly scribbled it in, so not sure if it breaks, please let me know
    in the comments if you found it useful or found an error. Cheers!
    
    I'll follow up with a blog post and demo soon on http://blog.robertpataki.com :)
*/

/*global PIXI _*/
var canvasEl,
    pixi,
    stage,
    loader,
    anim_mc,
    animTextures,
    frameData,
    totalFrames;

var animJSON = 'images/animations/my-anim.json';
var animSprite = 'images/animations/my-anim.png';

// PIXI init
canvasEl = document.createElement('canvas');
canvasEl.setAttribute('id', 'pixiCanvas');
document.body.appendChild(canvasEl);

pixi = PIXI.autoDetectRenderer(200, 200, {
    view: canvasEl,
    resolution: window.devicePixelRatio || 1,
    autoResize: true,
    transparent: false,
    antialiasing: true,
    interactive: false
});
stage = new PIXI.Container();

// Loader init
loader = new PIXI.loaders.Loader();
loader.add(animJSON);
loader.add(animSprite);
loader.on('complete', onAnimDataLoaded);
loader.load();

// Handle the load complete event
function onAnimDataLoaded() {
    loader.off('complete', onAnimDataLoaded);
    
    // This is where the magic happens - Getting the frame object from the loader
    frameData = loader.resources[animJSON].data.frames;
    totalFrames = _.size(frameData.frames);
    
    addAnimation();
};

// Add the animation to the stage
function addAnimation() {
    animTextures = {
        images: [],
        textures: []
    };

    _.each(frameData, function(data, key){
        var texture = PIXI.Texture.fromFrame(key);
        animTextures.images.push(key);
        animTextures.textures.push(texture);
    });
    
    anim_mc = new PIXI.extras.MovieClip(animTextures.textures);
    anim_mc.id = 'dude_mc';
    anim_mc.play();
    stage.addChild(anim_mc);
};

// Kill the animation and clean up
function killAnimation() {
    // Destroy the Textures with the BaseTextures to free up memory
    _.each(animTextures.images, function(src){
        PIXI.utils.TextureCache[src].destroy(true);
    });
    
    loader.reset();
};