Away3D 3.6 Essentials

Take Flash to the next dimension by creating detailed, animated, and interactive 3D worlds with Away3D

Determining the current frame rate

When we talk about the performance of an Away3D application, almost always we are referring to the number of frames per second (FPS) that are being rendered. This is also referred to as the frame rate. Higher frame rates result in a more fluid and visually-appealing experience for the end user. Although it is possible to visually determine if an application has an acceptable frame rate, it can also be useful to get a more objective measurement. Fortunately, Away3D has this functionality built in. By default, when it is constructed, the View3D class will create an instance of the Stats class, which is in the away3d.core.stats package. This Stats object can be accessed via the statsPanel property from the View3D class. You can display the output of the Stats object on the screen using the Away3D project stats option in the context (or right-click) menu of an Away3D application.

To see the Away3D Project stats option in the context menu you will need to click on a visible 3D object. If you click on the empty space around the 3D objects in the scene, you will see the standard Flash context menu.

This will display a window similar to the following screenshot:

This window provides a number of useful measurements:

• FPS, which measures the current frames per second
• AFPS, which measures the average number of frames per second
• Max, which measures the maximum peak value of the frames per second
• MS, which measures the time it took to render the last frame in milliseconds
• RAM, which measures how much memory the application is using
• MESHES, which measures the number of 3D objects in the scene
• SWF FR, which measures the maximum frame rate of the Flash application
• T ELEMENTS, which measures the total number of individual elements that make up the 3D objects in the scene
• R ELEMENTS, which measures the number of individual elements that make up the 3D objects that are being rendered to the screen

These values come in very handy when trying to quantify the performance of an Away3D application.

Setting the maximum frame rate

Recent versions of Flash default to a maximum frame rate of 24 frames per second. This is usually fine for animations, but changing the maximum frame rate for a game may allow you to achieve a more fluid end result. The easiest way to do this is to use the SWF frameRate meta tag, which is a line of code added before the Away3DTemplate class.

[SWF(frameRate=100)]
public class Away3DTemplate extends Sprite
{
// class definition goes here
}

The SWF FR measurement displayed by the Away3D Stats object reflects the maximum frame rate defined by the frameRate meta tag.

Note that setting the maximum frame rate using the frameRate meta tag does not mean that your application will always run at a higher frame rate, just that it can run at a higher frame rate. A slow PC will still run an Away3D application at a low frame rate even if the maximum frame rate has been set to a high value.

You also need to be aware that any calculations performed in the onEnterFrame() function, such as transforming a 3D object, can be dependent on the frame rate of the application. In the following code, we rotate a 3D object by 1 degree around the X-axis every frame.

override protected function onEnterFrame(event:Event):void
{
super.onEnterFrame(event);
shipModel.rotationX += 1;
}

If the frame rate is 30 FPS, the 3D object will rotate around the X-axis by 30 degrees every second. If the frame rate is 90 FPS, the 3D object will rotate around the X-axis by 90 degrees every second. If your application requires these kinds of transformations to be performed consistently regardless of the frame rate, you can use a tweening library.

Setting Flash quality to low

You may have noticed that Flash offers a number of quality settings in its context menu. This quality setting can be set to one of the four options, which are defined in the StageQuality class from the flash.display package. As described by the Flash API documentation, these settings are:

• StageQuality.LOW: Low rendering quality. Graphics are not anti-aliased, and bitmaps are not smoothed, but runtime still use mip-mapping.
• StageQuality.MEDIUM: Medium rendering quality. Graphics are anti-aliased using a 2 x 2 pixel grid, bitmap smoothing is dependent on the Bitmap.smoothing setting. Runtimes use mip-mapping. This setting is suitable for movies that do not contain text.
• StageQuality.HIGH: High rendering quality. Graphics are anti-aliased using a 4 x 4 pixel grid, and bitmap smoothing is dependent on the Bitmap.smoothing setting. Runtimes use mip-mapping. This is the default rendering quality setting that Flash Player uses.
• StageQuality.BEST: Very high rendering quality. Graphics are anti-aliased using a 4 x 4 pixel grid. If Bitmap.smoothing is true the runtime uses a high-quality downscale algorithm that produces fewer artifacts.

Mip-mapping refers to the use of mip-maps, which are precomputed smaller versions of an original bitmap. They are used instead of the original bitmap when the original is scaled down by more than 50 %. This bitmap scaling may occur when a 3D object with a bitmap material is itself scaled down, or off in the distance within the scene.

The quality setting is defined by assigning one of these values to the quality property on the stage object:

stage.quality = StageQuality.LOW;

A number of demos that are supplied with Away3D set the stage quality by using the SWF quality metatag, like so:

[SWF(quality=”LOW”)]

The Flex compiler does not support setting the stage quality in this way. Although this code will not raise any errors during compilation, the stage quality will remain at the default value of StageQuality.HIGH.
You can find more information on the metatags supported by the Flex compiler at http://livedocs.adobe.com/flex/3/html/help.html?content=metadata_3.html.

Setting the stage quality to low will improve the performance of your Away3D application. The increase is felt most in applications that display a large number of 3D objects.

The downside to setting the stage quality to low is that it affects all the objects on the stage, not just those drawn by Away3D. The low stage quality is particularly noticeable when rendering text, so the visual quality of controls like textfields and buttons can be significantly degraded.

Using the medium-quality setting offers a good compromise between speed and visual quality.

Reducing the size of the viewport

The fewer pixels that are drawn to the screen, the faster the rendering process will be. The area that the view will draw into can be defined by assigning a ClippingRectangle object to the clipping property on the View3D class.

To use the RectangleClipping class you first need to import it from the away3d.core.clip package. You can then define the area that Away3D will draw into by supplying the minx, maxX, minY, and maxY init object parameters to the RectangleClipping constructor like so:

view.clipping = new RectangleClipping(
{
minX: -100,
maxX: 100,
minY: -100,
maxY: 100
}
);

The preceding code will limit the output of the view to an area 200 x 200 units in size.

The ViewportClippingDemo application, which can be found on the Packt website as code bundle, allows you to modify the size of the clipping rectangle at runtime using the arrow up and arrow down keys. You can see the difference that the clipping rectangle makes in the following image. On the left, the clipping rectangle is set to the full area of the stage. On the right, the clipping rectangle has been reduced.