Calypso88

Since I had my benchmark code already warmed up from Friday and a photoshop doc open with my histograms, I figured I should make good on the updated speed tests that I promised a year ago.

Here is basic math, receiving a huge boost between debug and release modes. The shaded bar is the duration of the call, so shorter means faster execution.

From here down, everything is running 10m iterations. The scale of these graphs is 560ms. Here's the difference in calling a static public variable, versus a local copy of same.

Finally, replacing the Math helper methods with some logic and basic math:

These stack up pretty well with what I saw in the debug player a year ago (although there is an overall speed increase in all the tests).

If anyone is curious, there is a slowdown in calculating powers of a number (i * i * i * i) as you have to reference that variable over and over - for me the break-even between stringing on more 'i's and just calling Math.pow() was around 60.

I was messing around with some bitmap code this evening and I came across a performance bottleneck with some repeated calls to Math.random(). Since I haven't posted anything in a while, I decided to do some benchmarking and try out an alternate (psuedo) random number generator.

I chose the XOR algorithm, primarily because AS3 is lightning-quick with bit operations, and the algorithm is only 4 lines of code. Here are two versions I tried:

//  UINT
 
const MAX_RATIO:Number = 1 / uint.MAX_VALUE;
var r:uint = Math.random() * uint.MAX_VALUE;
 
//  returns a number from 0 - 1
function XORandom():Number{
	r ^= (r << 21);
	r ^= (r >>> 35);
	r ^= (r << 4);
	return (r * MAX_RATIO);
}

//  INT
 
const MAX_RATIO:Number = 1 / int.MAX_VALUE;
const NEGA_MAX_RATIO:Number = -MAX_RATIO;
var r:int = Math.random() * int.MAX_VALUE;
 
//  returns a number from 0 - 1
//  comment out line 13 for -1 - 1
function XORandom():Number{
	r ^= (r << 21);
	r ^= (r >>> 35);
	r ^= (r << 4);
	if(r < 0) return r * MAX_RATIO;
	return r * NEGA_MAX_RATIO;
}

It's worth noting that this algorithm works from a seed number. For my purposes, picking one random seed and iterating is fine, but this function is predictable enough that you wouldn't want to use this method for crypto or anything where you'd want "very random" data sets. This also could be useful in some situations where you'd want to replay a set of random numbers - such as generating enemies or levels in a game and then creating a replay by saving the seed number.

For my benchmark, I ran 25 sets of 10 million iterations on each function, using the 10.0 release player in Safari.

Interestingly, the logic to gate negative numbers in the signed-int version was enough to push it out quite a bit past the uint version. All told, the uint algorithm runs in just under one fourth the time it takes to call Math.random().

As always, Wikipedia will tell you as much as you want to know about the ins and outs of this algorithm and how it stacks up against other generators. And, just for fun, here's a frequency graph of the output.

I've seen a lot of questions about rotation in AS3 lately so I thought I'd post a quick writeup. It's a deceptively simple formula but there are a couple snags that can trip you up if you aren't aware of them.

First off - Flash uses a fairly confusing rotational layout. A DisplayObject's rotation is measured in degrees from 0, which is at 3 O'Clock. Degrees extend clockwise to 9 O'Clock (180°) where an odd thing happens. Flash converts any number you pass in to the closest possible value to zero, so 181° gets recorded as -179°. This is still technically correct, but it can wreak havoc on your code if you're not expecting it.

Here's a quick method to get the positive angle back:

spinner.rotation = 181;
trace(spinner.rotation);		//  -179
var angle:Number = spinner.rotation;	//  -179
angle = (angle + 360) % 360		//  181

Alright - what people really want to know is how to calculate the angle between an object and the mouse, or another object. The solution is to take the arc-tangent of the offset in y, divided by the offset in x, which, if you remember your trig from highschool, would be the two perpendicular sides of your right triangle. Here's what the code looks like:

package {
 
	/*
	*	Flash 10.0 ? ActionScript 3.0
	*	www.calypso88.com
	*/
 
	//--------------------------------------
	// PACKAGES
	//--------------------------------------
 
		import flash.display.Sprite;
		import flash.display.DisplayObject;
		import flash.geom.Point;
		import flash.events.Event;
 
	public final class Arrow extends Sprite {
 
		//--------------------------------------
		//  CONSTRUCTOR
		//--------------------------------------
 
			public function Arrow(){
				super();
				addEventListener(Event.ENTER_FRAME, enterFrame);
			}
 
	  	//--------------------------------------
	  	//  EVENT HANDLERS
	  	//--------------------------------------
 
			private function enterFrame(e:Event):void{
				var p1:Point = new Point(this.x, this.y);
				var p2:Point = new Point(stage.mouseX, stage.mouseY);
				this.rotation = angleBetween(p2, p1);
			}
 
		//--------------------------------------
		//  PRIVATE & PROTECTED INSTANCE METHODS
		//--------------------------------------
 
			private function angleBetween(p1:Point, p2:Point):Number{
				var deltaX:Number = p1.x - p2.x;
				var deltaY:Number = p1.y - p2.y;
				var angle:Number = Math.atan2(deltaY, deltaX);		//  in radians
				return radiansToDegrees(angle);
			}
 
			private function radiansToDegrees(r:Number):Number{
				return(r * (180 / Math.PI));
			}
 
			private function degreesToRadians(d:Number):Number{
				return(d * (Math.PI / 180));
			}
	}
}

The last surprise is that the arc-tangent comes back in radians (π radians = 180° degrees) so you'll need to convert back to degrees before you set the rotation. Here is the final result applied to a few dozen arrows.

Two friends asked for my list of RSS links within a week, so I figured I'd scrape together the sites that I like to keep an eye on for industry news, cool programming, and cutting edge Flash work. The site links are all on a list here, or you can download the set in OPML for direct injection into a feed reader.

Links | OPML

A big danger when working with large sets of data is the possibility of introducing a small slowdown that's compounded with every piece of data in the set. A common example is the multidimensional array; it's a powerful tool, but every time you look into the array you have to go at least two lookups deep to find your data. Normally that's not a big deal but if you're touching the set thousands of times per frame, it adds up quickly.

A fairly drastic solution is to flatten your arrays - it will give you a nice performance boost when you access the data, but it comes at the cost of obfuscation. Here's how it works:

(Sorry the numbers are goofy between the diagram and the code - CS4 crashed and I didn't feel like re-making that graphic)

In the traditional 2D view each "row" is a new Array object - this is where the added computing cost comes in. By flattening the data into one super-long array, you can access any piece of data with just one lookup. Finding the correct cell is a little more tricky though.

var myMDArray:Array = [
	['0a', '0b', '0c', '0d', '0e'],
	['1a', '1b', '1c', '1d', '1e'],
	['2a', '2b', '2c', '2d', '2e']];
 
var myFlatArray:Array = ['0a', '0b', '0c', '0d', '0e', '1a', '1b', '1c', '1d', '1e', '2a', '2b', '2c', '2d', '2e'];
 
var columns:int = 5;
 
trace(myMDArray[2][4]);
trace(myFlatArray[14]);
trace(myFlatArray[(2 * columns) + 4]);
//  2e, 2e, 2e

Now - supposing you have an index for something and want to reverse engineer the row and column - just break out the modulo grid code:

var row:int = int(14 / columns);
var col:int = 14 % columns;
 
trace(row, col);
//  2, 4