[Flex][Flash]Debug Loggingツール比較

Tags: AIR, FLASH, Flex

サーバーから受信したxmlデータをActionScript Objectで受信したとき、格納したArrayCollection (Array)の構造を簡単に調べたいというのがそもそもの目的。いくつかあたってみたのでその簡単な使い方と個人的な感想を書き留める。Flex 3でしか確認していないので、Flashの場合は少し勝手が違うかもしれません。結論を先に言うと、Xray, ThunderBolt, Arthropodの中で目的を達成できたのはXrayのみ。個人的に気に入ったのはArthropod。

調べたこと

以下のようなxmlデータをHTTPServiceのレスポンスとして受け取りArrayCollectionに格納したとき、ネストした内容(id, name)がLoggingツールで見れるかどうか確認。

<?xml version="1.0" encoding="utf-8"?>

<users>
    <user>
        <id>1</id>
        <name>Chris Allen</name>
    </user>
    <user>
        <id>2</id>
        <name>Wade Arnold</name>
    </user>
    <user>
        <id>3</id>
        <name>Aral Balkan</name>
    </user>
    <user>
        <id>4</id>
        <name>Nicolas Cannasse</name>
    </user>
</users>

1. Xray

生のArrayCollectionの中身は見えなかったが、ArrayUtil.toArray()を用いて受信データをArrayCollection -> Arrayに変換すれば確認可能。ツール自体の機能で、ステージ上のオブジェクト全てのプロパティを丸見えにすることができ、さらにプロパティをXrayコンソールから動的にいじることができるのが便利。フレームレートがリアルタイムに確認できるので、例えば予定以下のパフォーマンスだった場合に、ボトルネックになる箇所を探せる可能性がある(アルファをいじったら改善された etc.)。難点は超不安定なところ。専用コンソール(.swf)がやたらと落ちる(起動中に止まる)。Macを再起動しないと再生できないような状態になることもしばしばで、使うのがためらわれる。現在開発進行中ではないことも理由かもしれない。

使い方

osflash-xray - Google Code > Downloads > Xray_Flex2_Library_v0.5.swc をダウンロード(コネクター)。Flex3と名のつくものはなくてこれが最新バージョンになっている。
Xray ( The AdminTool ) Open Source Flash > Downloads > Interfaceよりコンソールをダウンロード(SWF Onlyと書かれたもの)。これを使ってモニターすることになる。
Flexプロジェクトにswcファイルにパスを通す。
```
import com.blitzagency.xray.inspector.flex2.Flex2Xray;
import com.blitzagency.xray.logger.XrayLog;
```
をインポートし、それぞれのインスタンスを作成して、swfファイルを起動(例えばmyFlexと命名)。
```
var xray:Flex2Xray = new Flex2Xray();
var log:XrayLog = new XrayLog();
```
Xrayコンソール(Xray.swf)を起動して左側のGoボタンを押すと調べたいswfファイルのモニタリングを開始する。
myFlex内の調べたいオブジェクトに例えば以下のような処理を(myFlex内で)施すことでXray.swfコンソールで中身を確認できる。
```
//ac is ArrayCollection receiving the xml data
var ary:Array = ArrayUtil.toArray(ac);
log.debug("Nested arrays:", ary);
```

2. Arthropod

シンプルでコンパクトで見た目もこぎれいなAIR製Logger。利用方法も簡単なので非常に良いと思うけど、目的は達成できず。ArrayColection、ArrayCollectionをArray変換したもの、ネストしたArrayともに視覚化できなかった。今回は結局何にもできなかったけど、個人的にはオススメ。

使い方

Arthropod > DownloadよりASソース(1ファイル)とコンソール本体(.air)をダウンロード
Flexプロジェクト(myFlex)にソースをインポート。
```
import com.carlcalderon.arthropod.Debug;
```
myFlex内の調べたいオブジェクトに以下のような処理を施し、myFlex.swfを起動するとArthropod.airで中身をモニターすることができる。Logging用のインスタンスを作らなくてよいところが便利。
```
//ac is ArrayCollection receiving the xml data
var ary:Array = ArrayUtil.toArray(ac);
Debug.array(ary);
```
他にもいくつかユーティリティがあるがそれほど多くなく、長ったらしいドキュメンテーションもない。

3. ThunderBolt

Arthropodと同じくモニターはair製で、Flash Playerが吐くFlashlog.txtをモニターする作りになっている。ArrayCollection、ArrayCollectionをArray化したものの視覚化はできなかったが、例えば以下のようにネストしたArrayの中身は確認できた。

var ary:Array = [{id:"1",name:"Chris Allen"},
                {id:"2",name:"Wade Arnold"},
                {id:"3",name:"Aral Balkan"},
                {id:"4",name:"Nicolas Cannasse"}];

ただ、僕の目的は達成できておらず、さらに起動までの設定が少し面倒、モニターが無駄にでかい、なんか見た目がダサイというところが使う気を起こさせない。

使い方

設定についてはFlashのログ閲覧アプリThunderBoltをいれてみた｜_level0.CUPPYが詳しいのでそちらを参照ください。少し補足しておくと、Flash PlayerにFlashlog.txt (Macの場合、/Users/USERNAME/Library/Preferences/Macromedia/Flash Player/Logs/flashlog.txt)というログファイルを吐き出させる設定が必要で、そのためには”/Users/USERNAME/mm.cfg”に以下の記述をする必要がある。