Sprite sheet animation vs loadTexture

[Drewrg 0]

Hello everybody.
I am trying to optimize my game, and would like to know, which of this two Phaser techniques would be  more optimal in term of resource usage.

On one side I got SpriteSheet -  'atlasJSONHash'.
 

// preload

game.load.atlasJSONHash('image', 'assets/image.png');

// create

var foo = game.add.sprite(0, 0, 'image');
    foo.animation.add('main');
    foo.animation.play('main', 30, true);

On other side I got just a sprite with a texture, and I'm changing  it's texture in the Phaser render function, with another preloaded texture.
 

// preload

var textureArray = [];
    textureArray.push(game.load.image('image0', 'assets/image0.png') );
    textureArray.push(game.load.image('image1', 'assets/image1.png') );
    textureArray.push(game.load.image('image2', 'assets/image2.png') );
    // and so on, 'in the game this is done by a loop'.

// create

var i = 0;
var foo = game.add.sprite(0, 0, 'image0');

// render

foo.loadTexture('image' + i);
i++;

In both cases there are same images [img0, img1, img2, ...], but in first example they are combined into a spritesheet, and in other they are separately loaded as a png images.

 

I would like to know, which would you recommend, again in terms of resource consumption.

Thank you in advance.

[scheffgames 88]

As far as I know the spritesheet approach it's the best in terms of performance since the GPU has to deal with only one image instead of lots of little ones. 

[Drewrg 0]

On 3/29/2017 at 7:11 PM, scheffgames said:

As far as I know the spritesheet approach it's the best in terms of performance since the GPU has to deal with only one image instead of lots of little ones. 

Thank you for respond.

[hicotech 3]

I had "similar" question recently and yes using spritesheets is best of course (as you probably know all games of any kind use that) but then there is a question spriteSheet vs spriteAtlas 

I asked here http://www.html5gamedevs.com/topic/9588-texture-atlas-better-than-spritesheets-performancewise/ and there is one good source of info.. after some concepts I managed to get just two calls to graphic card (even when using more than 1 spriteAtlas with many images inside of them) and game is much faster in terms of what GPU has to deal with

read more here https://phaser.io/tutorials/advanced-rendering-tutorial/part2