Tony Polinelli
Tarwin Stroh-Spijer

contact [at]
touchmypixel.com

6/25 Easey Street
Collingwood, 3066
Vic, Australia

+61 3 8060 5321

Caching Animation Frames VS Spritesheets

Apparantly drawing each frame of an animation to a single bitmap and then selecting a region to display is better for memory and speed than keeping each frame in its own bitmapData object.

The issue i’ve had is that for larger animations a sprite sheet of 2880×2880 is a little restrictive. To counter this ive modified bit101′s BigAssCanvas to allow a copyPixels of a rect, in order to get our frame data from a BIG Sprite sheet. This makes the test a little unfair, but small spritesheets are not an option for us.

The results are as follows:

uncached:  ~16fps
cached as frames: ~120fps
cached on spritesheet: ~70fps

memory usage:

frames: 249 856
spritesheet: 270 336

so caching each frame seems the way to go for us. There doesnt seem to be any advantage in the spritesheet. It might run faster if it was a single bitmapData object and direct coptyPixels – but who’s to say :P

15 comments


  1. Cool test. On my work machine the frames runs ~119 and spritesheet at ~110


  2. What kind of specs does the machine have? We’re currently testing on quad core 2.4ghz vista 64 machines.k


  3. HP (6820s) T8300 (2.6Gh 2Gb RAM) Mozilla FF 3.0 Adobe Flash player 10 : cashing OFF ~14 fps, cache as frame= 118, as spritesheet ~105

  4. sender

    this is awesome! Where did you get the idea to do this? I’m working on a pretty big platformer project right now and might have draw my sprites like this eventualy aswell. Where did you get the idea to try and render it this way?


  5. I think it was actually a pretty original idea. We just needed a way of getting non-stupidly-simple animations to play quickly in Flash and we asked ourselves why they didn’t, why our old SNES could do it, but our 12Ghz machine slowed to a crawl.

    We were already caching our backgrounds like this (to make things faster, it’s even faster than just setting cacheAsBitmap=true) so it was just the next logical step I guess.

    Warning, it does take a lot of memory, though we were surprised at how fast Flash is at doing the caching at all.

  6. sender

    Thanks for sharing!

    http://lts3.algonquincollege.com/matthias/platformer/ heres a link to the project I’ve been working on (this is not quite the latest build). Make sure you select a level before going “play now” or it will load nothing. Also press M to go back to the menu and then options to adjust some of the settings if it goes too slow.

    I’ve build the engine from the ground up but have been very frustrated with performance issues. I will definitly have to look into the way your caching stuff works.

    I have also seen that scary girl project you are working on. Great stuff man cant wait to see it once its complete!


  7. wow thats an amazing game- LOVE IT! the gfx could do with a little work, but the gameplay and design are great! i love the psudo 3d floor that you’ve made – very tricky! please email us a link when the game is complete – would love to play it


  8. Wow – that game rocks – I was actually thinking of making myself a Bio-Chem game as well. Sweet!

  9. sender

    heh thanks, I work for a college and in my department we make educational flash games for the mistry of education that get disributed to kindergardens, grade schools, and high schools. Most of them are very simple but we are in the process of making some more interesting ones.

    That one there will eventualy platformer game with tones of different themed levels with educational material that the players are forced to learn as they progress. Its a cool consept but right now I’m the only developer working on it and it keeps getting put aside to work on other projects.

    I’m also in the process of working on another platformer using box2dflash.

    I’ll post some links to everything once I get my website and blog back up and running haha

  10. Phil

    Great work here guys. I was perusing through the code and notice a reference to the following:

    clip["e_bounds"]

    I searched for info regarding “e_bound”s but could find nothing, would you elaborate on what exactly this “e_bounds” is.


  11. e_bounds is a movieclip which is used to define the ‘bounds’ of the aimation. Say the first frame is empty, but obviously there is stuff on the following frames. Without defining the bounds of the whole animation the code would not know the region to cache as bitmapData. We found it easy to put a clip in there, so you can resize and arrange it visually, as you want. Hope that helps.


  12. The best information i have found exactly here. Keep going Thank you


  13. Wow! what an idea ! What a concept ! Beautiful .. Amazing …


  14. [...] Конвертирования векторной анимации в растр для AS3 — touchmypixel. [...]

  15. ZiiZaaZaa

    i have 105 fps on first run. But when i resize flash window my fps go ~35 and don’t go up(((

 

Leave a Reply

Our Friends:

Powered by haXe / poko cms | Copyright 2008-09 TouchMyPixel