BitmapDataで高速化

どんどん処理が重くなっていってしまうようなものでもBitmapDataを使うことで高速化できることがあります
解説はつづきから

BitmapDataで高速化についてはしっぽさんが
Flashの描画速度をBitmapDataクラスを使って上げる方法
で詳しく説明してくれているので具体的なサンプルで比較してみます

新規ファイル作成
ステージ設定はサイズを400×300、背景色を#333333、フレームレートは30に

ランダムに線を描くActionScriptを記述
※statsはこちらにあります

//FPS、メモリ使用量を表示するStatsをインポート
import net.hires.debug.Stats;

//線を描いているかどうか判別用
var flag:Boolean = false;
//線の始点を納める配列
var pts:Array = [];
//線を描くスプライト
var base:Sprite = new Sprite();

for (var i:int = 0; i<4; i++) {
    pts.push(new Point());
}
addChild(base);
//Statsを表示
addChild(new Stats());

//クリックイベント追加
stage.addEventListener(MouseEvent.CLICK,onClick);
function onClick(e:MouseEvent):void {
    //flag切り替え
    flag = !flag;
    //flagがtrueのときは
    if (flag) {
        //baseにある線を削除
        base.graphics.clear();
        for (i = 0; i<4; i++) {
            //始点をランダムに設定
            pts[i].x = Math.random()*400;
            pts[i].y = Math.random()*300;
        }
        //線を描くイベント追加
        addEventListener(Event.ENTER_FRAME, loop);
    //flagがfalseのときは
    } else {
        //線を描くイベント削除
        removeEventListener(Event.ENTER_FRAME, loop);
    }
}

function loop(e:Event):void {
    //線の太さ、色設定
    base.graphics.lineStyle(2, 0xffffff);

    for (i= 0; i<4; i++) {
        //線の始点設定
        base.graphics.moveTo(pts[i].x, pts[i].y);
        //線の目的点を設定
        var newX = (Math.random() * 16 - 8) + pts[i].x;
        var newY = (Math.random() * 16 - 8) + pts[i].y;

        //ステージからはみださないように設定
        //表記の仕方については条件演算子で検索
        (newX > 400) ? newX = 400 : (newX < 0) ? newX = 0 : 0;
        (newY > 300) ? newY = 300 : (newY < 0) ? newY = 0 : 0;

        //線を描く
        base.graphics.lineTo(newX, newY);
        //始点の位置を目的点の位置に
        pts[i].x = newX;
        pts[i].y = newY;
    }
}

これでムービープレビューすると以下のようになるかと思います

spriteに描画をして表示していくとだんだん処理が重くなってきてしまいます

次にBitmapDataを使ってみます

import net.hires.debug.Stats;

var flag:Boolean = false;
var pts:Array = [];
var base:Sprite = new Sprite();

//400×300で#333333の色のBitmapData作成
var bmd:BitmapData = new BitmapData(400, 300, false, 0xFF333333);
//Bitmapを作成しBitmapDataと関連付け
var bmp:Bitmap = new Bitmap(bmd);

for (var i:int = 0; i<4; i++) {
    pts.push(new Point());
}
addChild(bmp);
addChild(new Stats());

//クリックイベント追加
stage.addEventListener(MouseEvent.CLICK,onClick);
function onClick(e:MouseEvent):void {
    flag = !flag;
    if (flag) {
        bmd.fillRect(bmd.rect,0xFF333333);
        for (i = 0; i<4; i++) {
            pts[i].x = Math.random()*400;
            pts[i].y = Math.random()*300;
        }
        addEventListener(Event.ENTER_FRAME, loop);
    } else {
        removeEventListener(Event.ENTER_FRAME, loop);
    }
}

function loop(event:Event):void {
    //以前描いた線を消す
    base.graphics.clear();
    base.graphics.lineStyle(2, 0xffffff);
    for (i= 0; i<4; i++) {
        base.graphics.moveTo(pts[i].x, pts[i].y);

        var newX = (Math.random() * 16 - 8) + pts[i].x;
        var newY = (Math.random() * 16 - 8) + pts[i].y;
        (newX > 400) ? newX = 400 : (newX < 0) ? newX = 0 : 0;
        (newY > 300) ? newY = 300 : (newY < 0) ? newY = 0 : 0;

        base.graphics.lineTo(newX, newY);
        pts[i].x = newX;
        pts[i].y = newY;
    }
    //baseをbmdに写す
    bmd.draw(base);
}

これでムービープレビューすると以下のようになるかと思います

これだと処理速度がいつまでも変わらず表示できます

以上、BitmapDataで高速化でした