Question

Right, so let’s say I want to compare two BitmapDatas. One is an image of a background (not solid, it has varying pixels), and another is of something (like a sprite) on top of the exact same background. Now what I want to do is remove the background from the second image, by comparing the two images, and removing all the pixels from the background that are present in the second image.
For clarity, basically I want to do this in AS3.

Now I came up with two ways to do this, and they both work perfectly. One compares pixels directly, while the other uses the BitmapData.compare() method first, then copies the appropriate pixels into the result. What I want to know is which way is faster.

Here are my two ways of doing it:

Method 1

for (var j:int = 0; j < layer1.height; j++)
{
    for (var i:int = 0; i < layer1.width; i++)
    {
        if (layer1.getPixel32(i, j) != layer2.getPixel32(i, j))
        {
            result.setPixel32(i, j, layer2.getPixel32(i, j));
        }
    }
}

Method 2

result = layer1.compare(layer2) as BitmapData;

for (var j:int = 0; j < layer1.height; j++)
{
    for (var i:int = 0; i < layer1.width; i++)
    {
        if (result.getPixel32(i, j) != 0x00000000)
        {
            result.setPixel32(i, j, layer2.getPixel32(i, j));
        }
    }
}

layer1 is the background, layer2 is the image the background will be removed from, and result is just a BitmapData that the result will come out on.

These are very similar, and personally I haven’t noticed any difference in speed, but I was just wondering if anybody knows which would be faster. I’ll probably use Method 1 either way, since BitmapData.compare() doesn’t compare pixel alpha unless the colours are identical, but I still thought it wouldn’t hurt to ask.

Answer 1

This might not be 100% applicable to your situation, but FWIW I did some research into this a while back, here’s what I wrote back then:

I’ve been meaning to try out grant skinners performance test thing for a while, so this was my opportunity.

I tested the native compare, the iterative compare, a reverse iterative compare (because i know they’re a bit faster) and finally a compare using blendmode DIFFERENCE.

The reverse iterative compare looks like this:

for (var bx:int = _base.width - 1; bx >= 0; --bx) {
 for (var by:int = _base.height - 1; by >= 0; --by) {
  if (_base.getPixel32(bx, by) != compareTo.getPixel32(bx, by)) {
   return false;
  }
 }
}
return true;

The blendmode compare looks like this:

var test:BitmapData = _base.clone();
test.draw(compareTo, null, null, BlendMode.DIFFERENCE);
var rect:Rectangle = test.getColorBoundsRect(0xffffff, 0x000000, false);
return (rect.toString() != _base.rect.toString());

I’m not 100% sure this is completely reliable, but it seemed to work.

I ran each test for 50 iterations on 500×500 images.

Unfortunately my pixel bender toolkit is borked, so I couldn’t try that method.

Each test was run in both the debug and release players for comparison, notice the massive differences!

Complete code is here: http://webbfarbror.se/dump/bitmapdata-compare.zip