Sign in to follow this  

Tilesprite vs Many Sprites

Recommended Posts

Howdy all


Whats the best way, performance wise, to dynamically create rows of bricks....


I have a spritesheet for "bricks" in my game world.

Each brick/frame is 100x50. I've got 8 different bricks right now, so thats an 800x50 image.

I load it in as a spritesheet, and define it as 100 x 50. All good:

this.load.spritesheet('bricks', 'assets/images/bricks.png', 100, 50);

Method 1 - using Tilesprites

When I want to create a big row of bricks, say 6 bricks (600px long), I use a Tilesprite, set its size as 600 x 50, and choose a frame (brick) I want and its all good:

positionX = 100;positionY = 200;length = 600;    //can change the length as neededheight = 50;    //usually 50 to match spritesheetkey = 'bricks';frame = 3;     //spritesheet has 8 different bricks so I can use anything from 0 to 7var rowOfBricks =, positionY, length, height, key, frame);

Method 2 - use normal Sprites

The alternative would be to have a method that takes the length argument and loops around X times to create X sprites and positions them appropriately.

eg length 600 = 6 sprites of 100 length each.



So with the context set..... what is the best practice here with regard to performance?


For example, I have a border of bricks around each level.

Method 1 = 4 Tilesprites (top,bottom, left,right).

Method 2 = For my default level size, would be 30 sprites.

On the face of it, 30 sprites seems less efficient than 4 Tilesprites.


I'm currently using Tilesprites and it seems to working quite conveniently.

Should I be concerned about using a large number of Tilesprites, say 10 to 20 in a single level?


(Note I am getting a weird recurring crash in Firefox, not sure yet if thats Tilesprite related, need to create a test case.)

Share this post

Link to post
Share on other sites

I'd say TileSprites would be more efficient for this purpose; certainly in webGL the mechanism for tiling a texture is pretty much 'free' performance-wise, and I imagine the canvas operation is at least slightly less expensive than the overhead of tracking several separate Sprites.

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.