1. 60fpsへの道：
Flashゲームにおける
パフォーマンスチューニングの A to Z
Andy Hall
Adobe Japan
© 2012 Adobe Systems Incorporated. All Rights Reserved.

2. Andy Hall アンディ ホール
Game Evangelist ゲーム エバンジェリスト
Adobe Japan アドビ システムズ 株式会社
@fenomas
© 2012 Adobe Systems Incorporated. All Rights Reserved.

3. Agenda
• 最適化の全体的な話
• ActionScript 3.0 最適化
• Flash Player 内部設計
• レンダリング最適化
• 今後のトピック
© 2012 Adobe Systems Incorporated. All Rights Reserved.

4. 最適化の原則
“Premature
optimization is the
root of all evil”
Donald Knuth
（早すぎる最適化は諸悪の根源）
© 2012 Adobe Systems Incorporated. All Rights Reserved.

5. 最適化の流れ
パフォーマンス 効率よく、 最適化
向けの設計作り 迅速に開発 （ボトルネックのみ）
© 2012 Adobe Systems Incorporated. All Rights Reserved.

6. Metrics
最適化の前には測定基準が必要。
• FPS
• メモリー使用量
• CPU 使用率
• Bandwidth?
• バッテリー消費
• etc...
© 2012 Adobe Systems Incorporated. All Rights Reserved.

7. プロファイリング
現在: 近未来:
Flash Builder 4.6 プロファイラー コードネーム「モノクル」
© 2012 Adobe Systems Incorporated. All Rights Reserved.

8. ACTIONSCRIPT 最適化
© 2012 Adobe Systems Incorporated. All Rights Reserved.

9. ActionScript 3.0 の最適化
注意：
• レンダーリングの方が
ネックの場合が多い
• 良く見る最適化の
「コツ」は多くの場合
無視しましょう
© 2012 Adobe Systems Incorporated. All Rights Reserved.

10. 基本の基本
• AS3.0 は必須
常に！
• すべての変数に型付け
• Array、Dictionaryより
Vector.<type>
ネック • RegExpよりStringメソッド
の場合 • E4X、XML は要注意
( )
• イベントよりコールバック
© 2012 Adobe Systems Incorporated. All Rights Reserved.

11. Pooling
インスタンス化のコストが高い！
オブジェクトのプール、再利用で、インスタンス化と
処理のコストを抑える
• Static temps
• オブジェクト pooling
© 2012 Adobe Systems Incorporated. All Rights Reserved.

12. Function コール
ファンクションコールにもコストそこそこ。
コールスタックを浅く、再帰的定義を避けよう。
© 2012 Adobe Systems Incorporated. All Rights Reserved.

13. ガベージコレクション
GCを良く知ろう！
• Flash のGCは参照カウント、 マーク・スイープを
両方実装している。
（メモリー使用量の最適化には上記の理解が絶対条件！）
• モノクルを利用して、GC発生の頻度をチェックしよう。
• プール、再利用してGCの発生を抑えよう。
• リテラル（String、intなど）はヌルにするだけで処理
が済むので、大量データをリテラルとして扱おう。
© 2012 Adobe Systems Incorporated. All Rights Reserved.

14. GCをスマートに
GCの都合の良いタイミングをFlashに教えよう。
画面切り替え、ポーズ画面等で上記を呼ぼう。
FlashのGC処理の準備は徐々に進んでいる。上記コマンドでは、
今のタイミングで処理するようにFlashに指示する。
因数は緊急性を表す。
imminence=0.99; // すぐに処理ができれば発生させる
imminence=0.01; // 処理の準備がまだ多少残っても発生させる
© 2012 Adobe Systems Incorporated. All Rights Reserved.

15. 参考文献：
「ActionScript 3.0 パフォーマンスチューニング」
（野中 文雄 著）
© 2012 Adobe Systems Incorporated. All Rights Reserved.

16. FLASH 内部設計
© 2012 Adobe Systems Incorporated. All Rights Reserved.

17. 全体像
// フラッシュの内部ループ（単純的に）
while() {
sleep until (nextEvent OR externalEvent)
if ( various events pending ) {
handleEvents();
// Timerイベント、
// audio/video バッファー等を処理する
}
if ( time for next SWF frame ) {
parseSWFFrame();
executeActionScript();
}
if ( screen needs update ) {
updateScreen();
}
}
© 2012 Adobe Systems Incorporated. All Rights Reserved.

18. Flash の内部ループ
次のSWF
外部からの フレームを処理 レンダー
イベント処理 （表示）
スクリプト実行
sleep
© 2012 Adobe Systems Incorporated. All Rights Reserved.

19. ポイント！
定期的な処理は基本的に
Event.ENTER_FRAME で！
ENTER_FRAME
次のSWF
外部からの フレームを処理 レンダー
イベント処理 （表示）
スクリプト実行
sleep
© 2012 Adobe Systems Incorporated. All Rights Reserved.

20. 表示リスト
Vector
shapes
Video
Bitmap
Display List
© 2012 Adobe Systems Incorporated. All Rights Reserved.

21. 再描画領域
“Dirty”
(再描画される)
フレーム Display List
アップデート
© 2012 Adobe Systems Incorporated. All Rights Reserved.

22. 表示プレーン
Vector
3D
Video
Display List
© 2012 Adobe Systems Incorporated. All Rights Reserved.

23. 描画モード
wmode （Flash ）
renderMode （ AIR）
direct
GPU
gpu CPU
cpu ブラウザー
Flash
レンダリング
transparent
opaque
© 2012 Adobe Systems Incorporated. All Rights Reserved.

24. レンダリング 最適化
© 2012 Adobe Systems Incorporated. All Rights Reserved.

25. Rendering 基本
• 表示リストを浅くしよう。
理由：再描画領域内
のすべてが
毎フレーム完全に
処理されるため Display List
© 2012 Adobe Systems Incorporated. All Rights Reserved.

26. Rendering 基本
ある表示機能は物理的に重い。
気を付けながら使おう。
• ビットマップエフェクト
（グロー、ドロップシャドー等）
• マスク（ベクターベースだし）
• アルファーチャンネル・半透明
• ブレンドモード（add、multiply等）
• 組み込みフォント（特に日本語！）
© 2012 Adobe Systems Incorporated. All Rights Reserved.

27. Rendering 基本
• 用が済んだものはStageから消去
• 適切なフレームレートを
• ベクターシェイプを簡単化しよう
© 2012 Adobe Systems Incorporated. All Rights Reserved.

28. Stage設定
• 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.
© 2012 Adobe Systems Incorporated. All Rights Reserved.

29. Rendering 内部設計
• ラスタライズ化の条件、
ビットマップキャッシュは
デザイナーさんも含めて理解しよう!
© 2012 Adobe Systems Incorporated. All Rights Reserved.

30. Bitmap Caching
• 複雑なアセットを
一度ラスタライズして
後はビットマップが
代わりに使われる。
• ビットマップエフェクト、ブレンドモード等を
利用する場合に自動的に適用
一般的なFlashコンテンツの最適化には、
これは何より大事！
© 2012 Adobe Systems Incorporated. All Rights Reserved.

31. 再ラスタライズの条件
foo.cacheAsBitmap = true;
キャッシュ 再ラスタライズ
のまま
foo.cacheAsBitmapMatrix = new Matrix();
キャッシュのまま
GPUで描画される
AIRアプリのみ！
© 2012 Adobe Systems Incorporated. All Rights Reserved.

32. Bitmap Caching
キャッシュ状態をモノクルで確認しよう。
© 2012 Adobe Systems Incorporated. All Rights Reserved.

33. Rendering 最適化
最後の一言：
現場のスペックに合わせよう！
500 particles 200 particles
© 2012 Adobe Systems Incorporated. All Rights Reserved.

34. レンダリング モデル
© 2012 Adobe Systems Incorporated. All Rights Reserved.

35. Rendering Models
現代のゲームに、
レンダーモデルは主に４つ：
1. Display List
2. GPU mode
3. Blitting
4. Stage3D
© 2012 Adobe Systems Incorporated. All Rights Reserved.

36. １．表示リストモデル
• Flash Proアニーメータが作る、タイムライン
アニーメーションベースの一般的なコンテンツ
• 作りやすい。パフォーマンスは低い。
• PC向けの軽いコンテンツには十分に使える。
モバイルにはNG。（GPU一切使われないし）
• 最適化のキーテクニックはビットマップ
キャッシュである。
© 2012 Adobe Systems Incorporated. All Rights Reserved.

37. ２．GPU Mode
• AIRアプリのパブリッシュ設定である。
Android、iOSにも対応する。
• 設定の場合、ベクターやビットマップをGPU経由で
描画しようとする。
• movieclip.cacheAsBitmapMatrix を正しく、注意深く
使えば、かなりパフォーマンスが出る。
• 現代までは有力なモデルだが、今後の作品・
新プロジェクトにはおすすめできない。
© 2012 Adobe Systems Incorporated. All Rights Reserved.

38. GPU Mode 事例
モンスタープラネットSMASH!
(GREE)
参考：
© 2012 Adobe Systems Incorporated. All Rights Reserved.

39. ３．Blitting（ブリット）
• StageにBitmapを置いて、自分で扱うビットマッ
プデータをBitmapData.copyPixels()で
ゲームエリアに手動的に描く。
• つまり、レンダリングを完全に自分で担当。
• 固い条件が満たされる場合、効果的である。
• 解像度の高い（Retina）画面には
スケールしないので寿命が…
© 2012 Adobe Systems Incorporated. All Rights Reserved.

40. 4. Stage3D
© 2012 Adobe Systems Incorporated. All Rights Reserved.

41. ４．Stage3D
• Flash 11.0からの新機能。ActionScriptから
シェーダープログラムを直接GPUに送れる。
• AGAL (Adobe Graphics Assembly Language) を利用する
• AGAL とはこんな感じ： m44 op, va0, vc0
dp4 op.x, va0, vc0
dp4 op.y, va0, vc1
• 一般的な開発者には dp4 op.z, va0, vc2
dp4 op.w, va0, vc3
ライブラリーが必要！ m44 op, va0, vc0
mov v0, va1
（ヒトリデハキケンジャ！）
© 2012 Adobe Systems Incorporated. All Rights Reserved.

42. Stage3D ライブラリー
（ コレヲ サズケヨウ！）
• オフィシャルライブラリー （free, open source）：
• Starling (2D)
• Away3D
• ニーズによって他にも様々…
N2D2
Genome2D
© 2012 Adobe Systems Incorporated. All Rights Reserved.

43. Stage3D 事例
© 2012 Adobe Systems Incorporated. All Rights Reserved.

44. 今後のトピック
© 2012 Adobe Systems Incorporated. All Rights Reserved.

45. AS3 ワーカー
作成
メイン
バックグラウンド
ワーカー ワーカー
MessageChannel
（既存 API （制限付き）
Flash Player）
mutex
共用メモリー
© 2012 Adobe Systems Incorporated. All Rights Reserved.

46. AS3 ワーカー
作成
メイン
バックグラウンド
ワーカー ワーカー
MessageChannel
（既存 API （制限付き）
Flash Player）
mutex
共用メモリー
© 2012 Adobe Systems Incorporated. All Rights Reserved.

47. Longer term
新コンパ プロジェクト Flash Proを ActionScript
イラー！ モノクル より進化！ の次版・・？
© 2012 Adobe Systems Incorporated. All Rights Reserved.

48. ご清聴ありがとうございました。
andhall@adobe.com
@fenomas
© 2012 Adobe Systems Incorporated. All Rights Reserved.

49. © 2012 Adobe Systems Incorporated. All Rights Reserved.