I’ve done a lot of reading on performance enhancements and testing solutions for Flash, but I’ve never actually done any A/B testing of my own. Let’s fix that.
I’m using yesterday’s SolarCraft as a template; it has a few game logic loops and a bunch of movement on the screen, vector calculations and Vector iterations. I think it’s a good “realistic” platform, as opposed to looping through display-less routines or something. I hope to gain practical data here, not theoretical!
For each of my tests I simply adjust the number of ”collectors” that spawn when you click on the base in SolarCraft. This gives me a quick and easy item count, and I’ve tacked on a profiler to see my memory use and framerate.
cacheAsBitmap
Setting the “.cacheAsBitmap” property to “true” on DisplayObjects is supposed to make normally-vector art display faster, but only if the art translates (not if it rotates or scales). Let’s see!
With cacheAsBitmap set to FALSE, I can maintain a constant 30FPS with a maximum of 800 collectors on screen. Memory use peaks at about 8.25mb. Or roughly 0.010mb per collector.
With cacheAsBitmap set to TRUE, I can maintain a constant 30 FPS with a maximum of 1,900 collectors on screen. Memory use peaks at about 26mb, or 0.013mb per collector.
A slight (but marginal) increase in memory usage for more than double the performance! That’s pretty good.
Adding Rotation
As it stands, the collectors are only translating; let’s see what happens if we add a slow rotation to the collectors each frame ( collector.rotation += 0.01 ):
Eek. Using the previous 1,900 collectors, my performs drops from 30FPS down to 8FPS. Attempting to regain my 30FPS, I had to drop my collector count to 500 – below our baseline 800 figure when cacheAsBitmap is turned off.
With cacheAsBitmap turned off and rotations left on, I easily reach back up to the 800 mark at 30 FPS.
Seems like vectors are indeed much better performers when it comes to rotation (and memory usage didn’t change).
Scaling
I’m replacing my rotation code with scaling code ( collector.scaleX += 0.01 ) to see if we get similar performance numbers as we did with rotations.
With cacheAsBitmap turned off, I hit 30 FPS with 700 collectors on screen. a Slight performance drop from our Scaling experiment.
With cacheAsBitmap turned on, I hit 30 FPS with 500 collectors on screen.
So it looks like cacheAsBitmap performs equally as poorly with scaling as it does with rotation; but default vector behaviour handles rotation better than scaling.
Rotation AND Scaling
The results of this test were identical to the Scaling test, so I won’t reproduce them here.
Conclusions
It looks like Adobe’s documentation was factually accurate. cacheAsBitmap gives you significant performance gains if you don’t rotate or scale your vector art at all, and stick to simple x/y translations. cacheAsBitmap will also marginally increase your memory footprint.
But those results I expected.
What I didn’t expect to see was scaling performing worse than rotation in the vector realm. That’s interesting…
Great to hear! I had tried testing performance to decide whether to go with bitmap art or vector art, and my conclusion was that although vector art was faster with rotation, once any amount of detail was added to the vector art, it was better to just render to bitmap (essentially a manual cacheAsBitmap step) and then render the bitmap rotated.
Doesn’t rotating the bitmap cost you an arm and a leg in processing time?
Just curious but have you considered using a blitting engine to test rendering thousands of collectors? 8 Bit Rocket has some fantastic AS3 tutorials on using blitting with an optimized timer to really crank out pixels. I did a demo on it for a local game dev group and with a simple 2 frame sprite sheet, I was able to render 2500 animated sprite objects at a locked 30 fps using CopyPixels and a bitmap canvas. Using the DisplayObject addchild method I was only able to render 500 sprite objects before starting to see dropped frames.
Rotation is a problem though. To rotate the pixels you either have to pre-rotate the sprites on the sprite sheet itself or use CPU penalizing matrix operations.
Here’s some crude demo code and a Power Point I did on Blitting for a local game dev discussion group. 8 Bit Rocket has better documentation though.
http://www.pxlgames.com/2010/06/updated-tech-workshop-1-files/
I think the fastest method is to blit the little squares into a Bitmap object. Then you can rotate it without a problem. You would be doing a cache as bitmap once instead of having flash to recreate the cache in every frame.
We used that in Cluster Lander and it worked great. It has huge levels using only Bitmaps, no “full” blitting.