Flash performance tuning (EN)

60fps or Bust!
Flash Game Performance Tuning from A to Z

Andy Hall
Adobe Japan

© 2012 Adobe Systems Incorporated. All Rights Reserved.

Andy Hall アンディホール
Game Evangelist ゲームエバンジェリスト
Adobe Japan アドビシステムズ株式会社
@fenomas


Agenda

• Overview
• Tuning ActionScript 3.0
• Flash Player Internals
• Rendering Optimization
• Upcoming topics


Principles of Optimization

“Premature
optimization is the
root of all evil”
Donald Knuth

（早すぎる最適化は諸悪の根源）


Optimization Flow

Build for
Architect for Optimize!
speed and
performance (only the slow parts)
correctness


Metrics

To optimize you need measurable metrics!

• FPS
• Memory usage
• CPU usage
• Bandwidth?
• Battery usage?
• etc...


Profiling
Now: Soon:
Flash Builder 4.6 Profiler Codename “Monocle”


TUNING ACTIONSCRIPT


Tuning ActionScript 3.0

Caveats:

• Often not as important
as rendering

• Beware of low-impact
“tips and tricks”


The Basics

• Always use AS3.0
Always!
• Type everything
• Prefer Vector.<type> over
Array or Dictionary
Only in • Prefer String methods over RegExp
critical
areas • Be careful with E4X and XML
( )
• Callbacks are faster than Event


Pooling
Instantiation can be expensive!
Pool or reuse objects to avoid the cost of frequent creation
and collection
• Static temps

• Object pooling


Function Calls
Function calls can be expensive too.
Keep a shallow call stack and avoid recursion:


Garbage Collections

Know your GC!

• Flash’s GC does both reference counting and
mark-sweep.
(If you want to tune memory usage, you need to understand these!)
• Use Monocle to find if GC is firing too often
• Pooling/reuse makes GC collection less frequent
• For large collections, prefer literals (String, int..) or plain
objects over complex objects (Sprite, Rectangle..)


Smart GC
Tell Flash when to trigger a GC!

Call this between levels, when the game pauses, etc.

Flash’s GC marks incrementally, and this command tells it to finish
marking and do a collection if a GC was already imminent. The
argument specifies how long you’re willing to wait for a GC:
imminence=0.99; // GC if ready now
imminence=0.01; // GC even if you need to pause a while


FLASH INTERNALS


The big picture
// Flash’s internal loop (simplified)
while() {
sleep until (nextEvent OR externalEvent)
if ( various events pending ) {
handleEvents();
// handles Timer events,
// fills audio/video buffers
}
if ( time for next SWF frame ) {
parseSWFFrame();
executeActionScript();
}
if ( screen needs update ) {
updateScreen();
}
}

© 2012 Adobe Systems Incorporated. All Rights Reserved. Gory details: http://blog.kaourantin.net/?p=82

Flash’s Internal Loop

Handle Next SWF frame
various Rendering
events Execute scripts

sleep


Point: Because of this, most
recurring scripts should be handled
in Event.ENTER_FRAME !

ENTER_FRAME

Handle Next SWF frame
external Rendering
events Execute scripts

sleep


The Display List

Vector
shapes

Video
Bitmap

Display List


Dirty Rectangles
“Dirty”
(redrawn)

(frame update)

Display List


Display Planes

Vector
3D
Video

Display List


Drawing Modes

wmode (Flash),
renderMode (AIR)

direct
GPU

gpu CPU

cpu Browser
Flash
Renderer
transparent
opaque

RENDERING OPTIMIZATION


Rendering Basics

The basics:
• Keep a shallow display list.

Reason: everything
in that rectangle
is getting redrawn
every frame! Display List


Rendering Basics

More basics:
• Understand that certain features are just heavy!
• Bitmap Effects (shadow, glow, emboss...)
• Masks (inherently vector-based)
• Alpha channels
• Blend modes (add, multiply...)
and even...

• Embedded fonts (especially Japanese!)


Rendering Basics
More basics:
• Keep extraneous stuff off the stage
• Use the right framerate
• Simplify vector shapes


Stage Settings
• StageQuality.LOW:
Lower-quality vector shapes. Never anti-alias, never
smooth bitmaps.
• StageQuality.MEDIUM:
Better vectors. Some anti-aliasing but no bitmaps
smoothing. Default value for mobile devices.
• StageQuality.HIGH:
Always uses anti-aliasing. Uses smoothing on bitmaps
depending on whether the SWF is animating.
Default value on desktop PCs.
• StageQuality.BEST:
Best quality. Always anti-alias, always smooth bitmaps.


Rendering Internals

Understand rasterization and the conditions
for cached bitmaps to get redrawn!
(Designers need to know this too!)


Bitmap Caching

• Lets complex assets
be rasterized once
instead of every frame.

• Turned on automatically if you use bitmap
effects

Caching is the single most important thing to
understand for tuning display list content!


Bitmap Caching
foo.cacheAsBitmap = true;

(redrawn)
(cached)

foo.cacheAsBitmapMatrix = new Matrix();

(cached)
(drawn with GPU)
(only in AIR!)


Bitmap Caching

Use Monocle to see what’s being cached

Rendering
One more technique:
Adjust visual effects at runtime!

500 particles 200 particles


RENDERING MODELS


Rendering Models

There are four main rendering models
in use today for Flash games.

1. Display List
2. GPU mode
3. Blitting
4. Stage3D


1. Display List Rendering

• Plain vanilla flash content, made in Flash Pro

• Easiest to build – worst performance.

• Suitable for prototypes and light desktop content.
Bad for mobile! (because the GPU is not used)

• Your key tuning technique will be bitmap caching.


2. GPU Mode
• GPU mode is a publish setting available for AIR apps on
devices (Android and iOS)

• When selected, Flash uses the GPU – vectors and cached
surfaces are rendered through hardware.

• Can be very powerful with careful, correct use of
movieclip.cacheAsBitmapMatrix

• Powerful technique today, but not recommended for
new/future projects


GPU Mode Example
Monster Planet SMASH!

(GREE)

More info:


3. Blitting
• Blitting refers to putting a Bitmap object on the stage for
your game area and manually drawing contents into it
with BitmapData.copyPixels().

• Hence, you manage your own rendering, caching, etc.

• Can be very fast in certain restricted cases

• Does not scale up for retina/hi-res devices!


4. Stage3D


4. Stage3D
• New feature from Flash 11.0, allowing ActionScript to
load shader programs directly to the GPU.

• Based on AGAL (Adobe Graphics Assembly Language)

• AGAL looks like this: m44 op, va0, vc0
dp4 op.x, va0, vc0
dp4 op.y, va0, vc1
• You probably want dp4 op.z, va0, vc2
dp4 op.w, va0, vc3
to use a 2D/3D library! m44 op, va0, vc0
mov v0, va1
(It’s dangerous to go alone!)

4. Stage3D
(Take this!)

• Two officially supported libraries:

• Starling (2D)

• Away3D

• And many, many more...

N2D2
Genome2D


Stage3D examples


NEW / FUTURE TOPICS


AS3 Workers

create

Main Background
Worker Worker
MessageChannel
(regular API (some
Flash player) limitations)

mutex

Shared
memory

ASC2.0

• All new ActionScript compiler!
• Included with the Flash Builder 4.7 preview:
http://labs.adobe.com/technologies/flashbuilder4-7/

• Key features:
• Faster compiles! More optimized bytecode!
• Error messages localized to JA, FR, ZH
• Inline functions, get/setters (when possible) (use –inline arg)
• goto statement (!?!?!?)

• Details: http://www.bytearray.org/?p=4789


Longer term

Project Better Better
Monocle! Flash Pro! ActionScript!


Thanks!

andhall@adobe.com
@fenomas


Flash performance tuning (EN)

Recommended

Recommended

More Related Content

Similar to Flash performance tuning (EN)

Similar to Flash performance tuning (EN) (20)

More from Andy Hall

More from Andy Hall (20)

Recently uploaded

Recently uploaded (20)

Flash performance tuning (EN)