Monday, May 12, 2008

Sprite vs Cached Bitmaps for Game Performance

My recent research time at the basement has been spent on comparing different caching techniques in regards to a side scrolling video games (yes, we are making a video game. yes, I am pumped as hell).

From my college/freelance days I gathered a collection of old AS2 resources for side scrolling and tile based engines from Strille, TonyPa, and OOS. However, most of these resources are outdated and do not touch important topics such as caching and optimization. (although TonyPa is updating an AS3 version of his tile engine tutorial).

So now I am here for round 2. And in this round I want to follow the industry standards. I am finding some great resources out there. Currently the most thorough is 8bitRocket from Jeff and Steve Fulton. They have tons of examples and plenty of tutorials to get you up to speed. I would also recommend Jobe Makar's blog (author of flash game design demystified). The rest of the resources I am stumbling across I will post as I pull from their examples in future posts.

The first thing I have been focusing on and trying to get my head around is caching animations. I want this game to be running at a smooth 30fps. The first gem I have found from 8BitRocket and Jobe Makar is a technique for caching a sprite animation as bitmapdata. You obviously can not just set the sprite to cacheAsBitmap since each time the sprite changed a new bitmap would have to be created. Instead, before the game starts you need to cycle through each frame of the sprite animation and copy it's pixels to an array of BitmapData. Then when the animation is playing you just copy the pixels from the next BitmapData in the array.

The performance increase is incredible. I made 500 dancing stick figures on the stage and was getting 6-8 fps when they were vectors. I was getting the full 30fps when I used the copyPixel technique.

Jobe mentions his use of the technique in a particle effect. 8BitRocket has a very thorough 4 part example of how to create an Atari Asteroids game. They mention caching each frame in part 2 when they are making the asteroid animations. And if you don't believe the performance increase, please check out Mike Grundvig's Blog, he has a great example showing how copyPixels is faster than using sprites.

If you have some of your own techniques. Please comment/email them. Would love to learn more. I'm still on my way up the learning curve and I know I have a ways to go.


Paul said...


Nice article. I've been meaning to look into this a bit more.

You might want to fix the link to Mikes blog tho.

Ickydime said...

Paul, thanks and good catch on the blog link. Should be fixed.

Jeff said...

Thanks for the mention, Mark. Let me know if you need some more info on any of this.

Ickydime said...

Of course man, you have been a great help and your tutorials are excellent resources.

basement finisher Toronto said...
This comment has been removed by a blog administrator.