速いFlash/ActionScriptチューニング入門（2）

Flashで吹雪のごとき描画を実現するチューニング3策

チームラボ株式会社
河北 啓史
2010/4/19

Flash/ActionScriptチューニングの基礎知識から実践的テクニックまでを紹介する連載。読みながら試せるオンライン・サンプルもあります。Adobe AIR/Flexにも応用可能です

Flash高速化は、ASの知識有無にかかわらず

　連載第1回の「Flashを閃光のごとく高速化するための基礎知識」では、実際のチューニング方法を語る前準備として、「どの処理に、どれだけ時間・リソースが割かれているか」、つまり“処理負荷”を調べる具体的な方法を紹介しましたが、あれから1カ月ちょっと経過しました。すっかり季節も変わり始めてしまいました。時がたつのは、速いものです。

　今回から、実践的なチューニング手法の解説が始まりますが、プログラムが不要なものから必須なものまであります。本連載は、基本的にはActionScript 3.0（以下、AS）の知識を必要としますが、知識がなくとも実践可能な手法がある際には、前半に紹介しようと思っています。

　また、ASの知識が必須の場合には、アイコンを表示しますので、必要に応じて読み分けてもらえればと思います。Flash/ASの基本については、下記記事を参照しておいてください。

いまさら聞けない！ FlashとActionScriptについて いまさら聞けないリッチクライアント技術（5）　今回は一般的にもおなじみの技術であるFlashの利点や欠点、作り方、中核技術であるActionScript、歴史などについて解説 「リッチクライアント ＆ 帳票」フ ォーラム 2007/10/18

Flashの基礎を無料で習得！ ActionScript入門 ActionScriptを知っていますか？ Flash技術の要となる言語で無料で簡単にFlashアプリケーションを作れます。そのActionScriptについて初心者のために一から丁寧に解説していきます

□ 「MovieClipを制するものは、描画を制す」

　というと、ちょっと大げさかもしれないですが、MovieClipは、アニメーションであろうとアプリケーションであろうと、Flashのあらゆる場面で使われるものです。MovieClipの最適化は、Flashチューニングにおいて「避けては通れない道」といえるのではないでしょうか。

　MovieClipのチューニングノウハウは多岐にわたりますが、定番ともいえる内容から少々マニアックな内容まで紹介できればいいなと思います（正確には、DisplayObject継承クラス全般に関する処理の最適化の話なのですが、使用頻度も高くプログラマの方にもデザイナの方にも伝わりやすいため、MovieClipとして解説します）。

　今回は、その中でも最も描画に関連の深い部分である、ベクタとラスタの使い分けについて話をしていきたいと思います。

□ チューニングの効果を実感してもうために

　日本のことわざにも「百聞は一見にしかず」という言葉がありますが、「こういう書き方・使い方をすると、こう速くなる！」といったことを、どれだけ文章や画像で説明しても信憑性がありませんね。そこで、実際に速度の変化を体感してもらうために以下のようなベンチマーク用のFlashを用意してみました。

　このFlashは、「CLICK TO START」をクリックすると、上から下へと無限に落ち続ける雪の結晶が次々と生成され、fpsがどんどん下がります。そしてfpsが10以下になったときに停止し、生成された結晶の数（以下、「スコア」と呼びます）が画面上に表示されるようになっています。

注：かなり負荷が高くなりますので、作業中の方は注意して実行してください。また次ページ以降、複数のサンプルFlashを同時に実行すると、負荷がとんでもないことになります。必ず、1つ1つ順番に実行し、計測完了まで行ってください。

fpsの変化を体感するためのFlashサンプル

　今回は、このようなスコアが表示されるFlashを使って、これから解説していくさまざまなチューニングを実際に施したものとスコアと比較しながら、チューニングの効果を体感してもらおうと思っています。

　ちなみに、私の環境（WindowsXP、Pentium Dual Core 1.6GHz、2Gbytes RAM）でのスコアは640でした。皆さんはどのようなスコアになったでしょうか。マシンの性能が高過ぎるとなかなか終わらないかもしれませんが、そんなときのために最大5000で止まるようになっています。

　それでは、このスコアをどこまで上げられるか、次ページから本題に入っていきたいと思います。

1-2-3-4

INDEX
速いFlash/ActionScriptチューニング入門（2）　 Flashで吹雪のごとき描画を実現するチューニング3策
	Page1 Flash高速化は、ASの知識有無にかかわらず
	Page2 【1】ベクタとラスタを使い分ける
	Page3 【2】Flash Playerに情報を保持「ビットマップキャッシュ」 POINT　「TextFieldには、ビットマップキャッシュが有効」！
	Page4 【3】あらかじめ描画の準備「プリレンダリング」 POINT　「BitmapDataの配列をクラスメンバとして定義」 注意！　「FlashのBitmapDataの限界サイズ」 注意！　「やり過ぎると、スクリプトタイムアウト」 たかがイベント処理と侮るなかれ

「デザインハック」コーナーへ

＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）