A homework assignment I was recently given for a Java programming class involved a competition to see who could create the most optimized implementation of an interface which was provided by the instructor. It was a challenging and very fun assignment that I think the whole class enjoyed. I didn’t win the competition but still came out a winner because of my heightened interest in application optimization and performance tuning that I gained.
I’m personally a pretty big fan of coding standards and have been ribbed by many developers over some of the longer method, variable and class names that I sometimes choose. I've always leaned toward the side of programming that employs standards and frameworks . Rather than spending a ton of time digging around in compiler specs and messing with GC (Garbage Collection) for reasons of performance, tuning and optimization. I was leaving this to the seasoned programmers creating the standards and frameworks I use.
This isn’t to say I’ve never paid attention to performance and I enjoy building slow applications. It’s almost like two different worlds; the optimization world and the standards world. They don’t always agree with each other. There can sometimes be a trade off for performance over readability and organization or vice-versa. This article is meant to stand next to the Flex Best Practices articles that I authored.
While creating my concrete implementation for the homework assignment I discovered a powerful profiling engine in NetBeans. The NetBeans profiling engine helped me understand some of the memory usage and consumption of each property, method call and object instantiation in my program. This profiler in NetBeans is very similar to the one found in Flex Builder. Both are very powerful and very useful. I've been exploring the Flex Profiler in greater detail lately as well and using it to eradicate memory leaks for a real world application I’ve been refactoring to best practices lately.
The Java optimization homework has increased my interest in optimization and profiling for ActionScript 3.0 and Flex development. I've been piecing together ActionScript optimization techniques and practices from around the web for a couple years now. Some of these techniques are in opposition to what the standards dictate but most of software development is this way. You have to learn when to use some techniques and when to leave some out.
Here are 51 ActionScript 3.0 and Flex optimization techniques and practices. I’ve scoured the web for and filtered practices and techniques that can be adopted into your application development process. Use these in conjunction with the Flex Profiler to monitor and optimize and tune the performance of your ActionScript 3.0 and Flex RIAs.
1. Avoid the new operator when creating Arrays
NOT:
2. Arrays are expensive to create, do so conservatively
var vanityCollection01 : Array = new Array();
var vanityCollection02 : Array = new Array();
var vanityCollection03 : Array = new Array();
var vanityCollection04 : Array = new Array();
3. Fastest way to copy an array:
var copy : Array = sourceArray.concat();
4. Setting values in Arrays is slow
employees.push( employee );
employees[2] = employee;
5. Getting values from Arrays is twice as fast as setting
var employee : Employee = employees[2];
6. Anonymous objects are faster to create with {} vs. new
var o : * = { firstName : "John", lastName : "Smith", age : 45 };
NOT:
var p : Person = new Person();
p.firstName = "John";
p.lastName = "Smith";
p.age = 45;
7. Use static for properties methods that do not require an object instance
StringUtils.trim( "text with space at end " );
Class definition:
package
{
public final class StringUtils
{
public static function trim( s : String ) : String
{
var trimmed : String;
return trimmed;
}
}
}
8. Use const for properties that will never change throughout the lifecycle of the application
public const APPLICATION_PUBLISHER : String = "Kannopy, Inc.";
9. Use final when no subclasses need to be created of a class
public final class StringUtils
10. Use package level variables and functions for generalized functionality which does not require a class or instance of a class
NOT:
someObjectInstance.createSnapShot( arg );
NOT:
SomeClass.createSnapShot( arg );
Class definition:
package
{
public function createSnapShot(target:IBitmapDrawable) : Bitmap
{
}
}
11. JIT won’t compile code within constructors (keep them lightweight)
package com.seantheflexguy.as3optimization
{
public class MinimalConstructor
{
public function MinimalConstructor()
{
init();
}
}
}
12. Length of method/variable names doesn't matter in ActionScript 3.0 (true in other langs)
someCrazyLongMethodNameDoesntReallyImpactPerformanceTooMuch();
13. One line assignments DO NOT buy any performance! It's a Myth! (true in other langs)
14. No difference in memory usage between an if statement and a switch statement
IDENTICAL MEMORY USAGE:
switch ( condition )
{
case "A":
break;
case "B":
break;
}
15. Rank your if statements in order of comparisons most likely to be true
if ( conditionThatHappensAlot )
{
}
else if ( conditionThatHappensSomtimes )
{
}
else
{
}
16. AVM promotes int to Number during calculations inside loops
17. Resolve issues of promotion, unknown, or incorrect object types
18. Use uint sparingly, it can be slow
var footerHex : uint = 0x00ccff;
19. Use integers for iterations
(var i: int = 0; i < n; i++) NOT for (var i: Number = 0; i < n; i++)
20. Cast to int for calculations inside loops (AVM automatically promotes int to Number)
for (;i<n2;i++) Vector3D(array[int(i*2)]).x = 2;
NOT:
for (;i<n2;i++) Vector3D(array[i*2]).x = 2;
21. Don't use int with decimals
var decimal : Number = 14.654;
NOT:
var decimal : int = 14.654;
22. Multiply vs. Divide: instead of 5000/1000 use: 5000*0.001
23. Calculate things like floor and round yourself vs. calling Math library
package com.seantheflexguy.math
{
public final class MathUtil
{
public static function round( number : Number ) : Number
{
}
}
}
24. Locally store function values in for and while statements instead of repeatedly accessing them
for (..){a*180/Math.PI;}
declare: toRadians = a*180/Math.PI; outside of the loop
25. Avoid calculations and method calls in loops
for (var i=0;i< myArray.lengh;i++){ }
NOT:
var len : int = myArray.lengh;
for (var i=0;i<len;i++){}
26. Remove event listeners when finished using them
removeEventListener( Event.COMPLETE, onComplete );
27. Use delete to free memory
28. Use RegEx for validation, use string methods for searching
private var regEx:RegExp = /^[A-Z][0-9][A-Z] [0-9][A-Z][0-9]$/i;
private function validatePostal( event : Event ) : void
{
if( regEx.test( zipTextInput.text ) )
{
}
}
var string : String = "Search me";
var searchIndex : int = string.indexOf( "me" );
var search : String = string.substring( searchIndex, searchIndex + 2 );
29. Reuse objects to maintain a “memory plateau” DisplayObjects, URLLoader objects
30. Follow the Flex component model:
createChildren();
commitProperties();
updateDisplayList();
31. Only use Datagrids as a last resort (make sure you can’t implement in a regular List first)
32. Avoid Repeaters for scrollable data
33. Avoid the setStyle() method (One of the most expensive calls in the Flex framework)
34. Using too many containers dramatically reduces the performance of your application
<mx:Panel>
<mx:VBox>
<mx:HBox>
<mx:Label text="Label 1" />
<mx:VBox>
<mx:Label text="Label 2" />
</mx:VBox>
<mx:HBox>
<mx:Label text="Label 3" />
<mx:VBox>
<mx:Label text="Label 4" />
</mx:VBox>
</mx:HBox>
</mx:HBox>
</mx:VBox>
</mx:Panel>
35. You do not need to always use a container tag as the top-level tag of components Totally valid component, no top level container needed:
<mx:Image xmlns:mx="http://www.adobe.com/2006/mxml"
source="avatar.jpg" width="200" height="200" />
36. Remove unnecessary container wrappers to reduce container nesting
37. Avoid: The VBox container inside an tag, (eliminates redundancy)
<mx:Panel>
<mx:Label text="Label 1" />
<mx:Label text="Label 2" />
</mx:Panel>
NOT:
<mx:Panel>
<mx:VBox>
<mx:Label text="Label 1" />
<mx:Label text="Label 2" />
</mx:VBox>
</mx:Panel>
38. Avoid: VBox container inside an tag, (eliminates redundancy)
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx=http:
<mx:Label text="Label 1" />
<mx:Label text="Label 2" />
</mx:Application>
NOT:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx=http:
<mx:VBox>
<mx:Label text="Label 1" />
<mx:Label text="Label 2" />
</mx:VBox>
</mx:Application>
39. Set the recycleChildren property to true to improve a Repeater object's performance (re-uses previously created children instead of creating new ones)
<mx:Script>
<![CDATA[
[Bindable]
public var repeaterData : Array = ["data 1", "data 2"];
]]>
</mx:Script>
<mx:Repeater id="repeater" dataProvider="{repeaterData}">
<mx:Label text="data item: {repeater.currentItem}"/>
</mx:Repeater>
40. Keep framerate set at 60 fps or lower
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx=http:
frameRate="45">
</mx:Application>
41. Avoid multiple display manipulations per frame
42. Code against ENTER_FRAME events instead of Timer events
public function onEnterFrame( event : Event ) : void
{
}
private function init() : void
{
addEventListener( Event.ENTER_FRAME, onEnterFrame );
}
NOT:
public function onTimerTick( event : Event ) : void
{
}
private function init() : void
{
var timer : Timer = new Timer();
timer.start();
timer.addEventListener( TimerEvent.TIMER, onTimerTick );
}
43. To defer object creation over multiple frames use:
<mx:Container creationPolicy=”queued”/>
44. Alpha = 0 is not the same as visible = false (Objects marked invisible are passed over)
loginButton.visible = false;
NOT:
45. Faster to perform operations locally than it is to call a function in the same class Even slower to call a function from a different class (This is referred to as “code inlining”.)
46. When executing a function it’s more expensive if you call other functions from within it
private function udpateUserRecord()
{
update( user.firstName + user.lastName );
}
NOT:
private function updateUserRecord() {
update( concatName() );
}
private function concatName() : String
{
return user.firstName + user.lastName;
}
47. Arguments in functions are slower than a reference to an objects variables
package com.seantheflexguy.as3optimization
{
public class DemoClassMemberVariables
{
public var userName : String;
public function DemoClassMemberVariables()
{
}
private function login() : void
{
userName = creds.getUserName();
}
}
}
NOT:
package com.seantheflexguy.as3optimization
{
public class DemoClassArguments
{
public function DemoClassArguments()
{
}
private function login( creds : Authentication ) : void
{
userName = creds.getUserName();
}
}
}
48. Faster to use "as" vs. casting
var u : User = event.results.users.user as User;
NOT:
var u : User = User(event.results.users.user);
49. Use custom object types vs new Object();
var v3D : Vector3D = new Vector3D();
v3D.x = 100;
v3D.y = 450;
v3D.z = 500;
NOT:
var v3DObject : Object = new Object();
v3DObject.x = 100;
v3DObject.y = 450;
v3DObject.z = 500;
50. Use casting to inform the Flash player what kind of objects are inside an Array
for (i=0;i<n;i++)
{
Vector3D( array[i] ).x = 2;
}
NOT:
for (i=0;i<n;i++)
{
array[i].x = 2;
}
51. Check for null instead of using try...catch blocks
if ( o != null )
{
o.method();
}
NOT:
try
{
o.method();
}
catch ( error )
{
trace( error );
}
References:
Sean Christmann: Optimizing Adobe AIR for Code Execution, Memory, and Rendering
http://www.craftymind.com/2008/11/20/max-2008-session-material/
Dennis Ippel: Some ActionScript 3.0 Optimizations
http://www.rozengain.com/blog/2007/05/01/some-actionscript-30-optimizations/
Shane McCartney: Tips on how to write efficient AS3
http://www.lostinactionscript.com/blog/index.php/2008/09/28/tips-on-how-to-write-efficient-as3/
Flex Application Performance: Tips and Techniques for Improving Client Application Performance
http://www.adobe.com/devnet/flex/articles/client_perf.html
Stephen Calender: ActionScript 3.0 Benchmarking
http://www.stephencalenderblog.com/?p=7
Grant Skinner: Types in AS3: ints not so fast, uints slow!
http://www.gskinner.com/blog/archives/2006/06/types_in_as3_in.html
Grant Skinner: Resource management strategies in Flash Player 9
http://www.adobe.com/devnet/flashplayer/articles/resource_management.html
Gary Grossman: ActionScript 3.0 and AVM2 Performance Tuning
http://www.onflex.org/ACDS/AS3TuningInsideAVM2JIT.pdf
Fastest way to copy an array
http://agit8.turbulent.ca/bwp/2008/08/04/flash-as3-optimization-fastest-way-to-copy-an-array/
Andre Michelle: AS3 optimations & suggestions
http://blog.andre-michelle.com/2005/as3-optimations-suggestions/
Package-level function closures in ActionScript
http://www.ericfeminella.com/blog/2008/05/06/package-level-function-closures-in-actionscript/
ActionScript 3 optimization techniques
http://blog.joa-ebert.com/2008/04/26/actionscript-3-optimization-techniques/
AS3 Performance Tester
http://businessintelligence.me/projects/performance_tester/performanceTester.html
플래시 object 및 embed 태그 사용시 매개 변수 및 속성
