AS3.0 TextField生成処理の速度検証

Flashはかなりテキストを扱うことが苦手です
大量のテキストを扱うとすぐに重くなってしまいます。

僕が仕事をする場合にも、テキスト情報が多いときには
先ず間違いなく、HTMLを推奨するわけですが
でもやっぱFlashで、ということも少なくないですね。

今回は、いつも特に気にせずやってしまっている
TextFieldの生成処理が、実は処理順で速度が違うのでは
という疑問から、検証をしてみたのでまとめてみました。

前提条件

今回の検証では、非常に面白い結果を見ることができました。
ですが、この検証結果には、注意すべき点がひとつだけあります。
それは、addChildされているかいないか という点です。

TextField の処理系は、addChild されているかいないかで
その処理速度の優劣が変わります。(レンダリングの問題が濃厚)

今回の検証は、主にaddChildする前の状態で検証しています。
また、全体的に addChild 前に処理する方が高速であることがわかりました。

それでは結果を発表してきたいと思います。

TextFormatの設定

defaultTextFormat を用いるよりも
setTextFormat したほうが倍以上早い。
( addChild している場合差はほとんどありませんでした )

tf = new TextField();
tf.defaultTextFormat = new TextFormat();
tf.text = "hogeeeeeeeeeeeeee";
//--------------------------- 234ms/3000回

tf = new TextField();
tf.text = "hogeeeeeeeeeeeeee";
tf.setTextFormat( new TextFormat() );
//--------------------------- 110ms/3000回

textの設定タイミング

自分の知人の多くに尋ねたら text の設定タイミングは
最後にしてるという人が多かったのですが
蓋を開けてみると、最初に設定するのが最速でした。

tf = new TextField();
tf.text = "hogeeeeeeeeeeeeee";
tf.autoSize = TextFieldAutoSize.LEFT;
tf.defaultTextFormat = new TextFormat();
tf.width = 10 + Math.random() * 100;
tf.wordWrap = true;
//--------------------------- 125ms/3000回

tf = new TextField();
tf.autoSize = TextFieldAutoSize.LEFT;
tf.defaultTextFormat = new TextFormat();
tf.width = 10 + Math.random() * 100;
tf.wordWrap = true;
tf.text = "hogeeeeeeeeeeeeee";
//--------------------------- 320ms/3000回

特に、TextFieldAutoSize の設定前が有効です。

TextFieldAutoSize

この設定は少々特殊で、前述のようにtext設定後に行うのが吉です。
また、addChildされていないときに、widthを変更する事がある場合
一度 NONE にしてから width を変更し、その後設定しなおす
この方法をとることが最速です。

tf = new TextField();
tf.text = "hogeeeeeeeeeeeeee";
tf.setTextFormat( new TextFormat() );
tf.wordWrap = true;
tf.multiline = true;
tf.autoSize = TextFieldAutoSize.LEFT;

と設定後

for( var i:uint = 0; i < 10000; i++){
    tf.width = 10 + i % 200;
}
//--------------------------- 297ms

for( var i:uint = 0; i < 10000; i++){
    tf.autoSize = TextFieldAutoSize.NONE;
    tf.width = 10 + i % 200;
    tf.autoSize = TextFieldAutoSize.LEFT;
}
--------------------------- 16ms

とかなりの速度差がでます。
また、addChild した後に限り、AutoSizeを使うよりも

tf.height = tf.textHeight + 4;

とする方が早いようです。


普段何気なく作っているTextFieldですが
作り方に少し工夫をしてみるのも面白いかもしれません。