MinimalComp of the week: FPSMeter

Simple one but useful.

[as3]new FPSMeter(this, 10, 10);[/as3]

gives you a numeric readout of the current calculated frames per second.

Demo time:

[kml_flashembed publishmethod=”static” fversion=”10.0.0″ movie=”http://www.bit-101.com/blog/wp-content/uploads/2009/08/FPSDemo.swf” width=”400″ height=”400″ targetclass=”flashmovie”]

[/kml_flashembed]

Here’s the code for that demo:

[as3]package
{
import com.bit101.components.*;

import flash.display.Sprite;
import flash.events.Event;

[SWF(backgroundColor=0xeeeeee, width=400, height=400)]
public class Playground extends Sprite
{
private var running:Boolean;

public function Playground()
{
new FPSMeter(this, 10, 10);
new PushButton(this, 10, 30, “Draw”, onClick);
new PushButton(this, 10, 55, “Clear”, onClear);
}

protected function onClick(event:Event):void
{
running = !running;
if(running)
{
event.target.label = “Stop”;
addEventListener(Event.ENTER_FRAME, onEnterFrame);
}
else
{
event.target.label = “Draw”;
removeEventListener(Event.ENTER_FRAME, onEnterFrame);
}
}

protected function onClear(event:Event):void
{
graphics.clear();
graphics.lineStyle(0, 0, .1);
}

protected function onEnterFrame(event:Event):void
{
graphics.lineStyle(0, 0, 0.1);
graphics.lineTo(Math.random() * 400, Math.random() * 400);
}
}
}[/as3]

Just draws random lines, which will eventually start to bog down the CPU and affect the frame rate. Clearing or stopping the drawing will bring it back up to 24.

A few notables:

1. It has a stop() and start() method to … well, to start and stop it.
2. When the component is removed from the stage, it will automatically stop, to avoid wasting enterFrame calls. Also, if you do not give it a parent in the constructor, it will not auto start. i.e. if you create the FPSMeter with a parent of null, and add it to the display list later, you will have to call start() on it after you add it.
3. Optional 4th parameter is prefix. This defaults to “FPS:” but you could set it to an empty string to just display the numbers, or whatever else you want, like: “Look how fast I’m going: “.
4. There is also a read-only fps property in case you want to graph it or do something if it goes below a certain level or something.
5. The algorithm is to count the number of frames and elapsed time. When a second has passed, the number of frames counted is the FPS (adjusted according to the elapsed time vs. one second). This means that the display only updates approximately once per second. This causes a bit of a visual lag in some cases, most notable when the FPS changes a lot, e.g. when you stop drawing in the above demo. But this is more efficient than methods that check the elapsed time every frame and calculate the FPS based on that. Those methods also tend to look very “jittery” as the calculated FPS can change slightly many times per second. Of course you can smooth that out by averaging, but that only uses up more CPU.

http://code.google.com/p/minimalcomps/