MovieClips vs CopyPixels

This article attempts to compare the rendering speed when MovieClips are used to display graphics against the speed when only Bitmaps are used.

This first SWF, when the test is started, will create 100 MovieClips and cause each of these MovieClips to diverge from the centre of the stage. These MovieClips consist of an animation which is 6 frames long (here, the animation has been slowed down) :  Each frame in the MovieClip is a transparent bitmap graphic. The frame rate for the SWF’s has been set in the IDE to 40.

Increase the number of spinning logos until the SWF exhibits a significant frame rate drop and remember that number. It should be somewhere around the 1000 mark. Let’s now compare this MovieClip performance with rendering the sprites using the BitmapData function copyPixels:

Again, increase the number of visible spinning logos until the SWF exhibits a discernable frame rate drop. You should be able to see that the ‘copyPixels’ method gives us vastly improved performance.

What makes the copyPixels Method Faster?

I won’t go into too much detail as I want this to be a succinct post. Basically, with copyPixels, you are telling the Flash Virtual Machine (VM) yourself exactly what to draw. However MovieClips instances have a large overhead because of the wealth of functionality that comes with them. This means that the VM takes time processing each MovieClip every frame, after which it has to calculate what and where to draw to the screen, which in turn means it takes longer for us to see the results on the screen.

We can see evidence of this if we look at drawing regions for the movie. For those who decide to download the source, if you run the SWF from the Flash IDE, there should be an option in the context menu called ‘Show Redraw Regions’. When you enable this option you can see what areas the VM has to draw every frame. With the MovieClip example you should be able to see that the areas that it is drawing is constantly changing.

Now the VM has to calculate, after analysing the positions and boundaries - along with a number of other properties - of every DisplayObject on the stage, the redraw regions for the movie before performing the actual drawing which takes time. With the copyPixels method it has to do the same thing. However, because there is only one DisplayObject to look at (a Bitmap instance) this obviously makes the VM’s job a lot easier.

There are more reasons as to why copyPixels is faster but that is all I’ll explain for now.

MovieClips vs copyPixels examples source.

Enjoy!