JavaScript覚書：IE6で文字列を扱うときの注意

JavaScriptで短い文字列を結合して長い文字列を作る際には、つい

text += "文字列";

のようにしてしまうのですが、これはIE6(及びそのエンジンを使用するブラウザ)だと、時に致命的な速度低下を招く可能性があることに気がつきました。

もしかして常識ですかね？(^^;)

function    stringTest1()
{
    var text = '' ;
    
    for ( var ci=0; ci < 5000; ci++ ) {
        text += ci + ': abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ' + '<br />\n' ;
    }
    
}   /* end of stringTest1() */

function    stringTest2()
{
    var text = '' ;
    var tmpStrings = new Array() ;
    for ( var ci=0; ci < 5000; ci++ ) {
        tmpStrings[tmpStrings.length] = ci + ': abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ' + '<br />\n' ;
    }
    text = tmpStrings.join('') ;
    
}   /* end of stringTest2() */

関数stringTest1()とstringTest2()は、共に適当な文字列を多数結合するだけのもので、最終的ｊな結果(textの内容)は同じになるのですが、これをIE6系で実行すると、実行に要する時間が数十倍違う(Test1>>Test2)、ということに。
実際に試すには→こちらから。

うーん、+=で結合すると、メモリ確保＆全コピーがその都度走っているのかなぁ……

【結果のサンプル】

	IE6 SP2	Sleipnir2.48 IE Engine(*2)	Sleipnir2.48 Gecko Engine	Firefox1.5.0.7	Opera9.01
t1(*1)	2047ms	24265ms 2734ms	146ms	224ms	78ms
t2(*1)	31ms	438ms 62ms	109ms	94ms	68ms
t1-t2	2016ms	23828ms 2672ms	37ms	130ms	10ms
t1/t2	6603%	5544% 4387%	134%	238%	115%

(*1)t1はTest1の、t2はTest2の所要時間(3回平均)。
(*2)どうも極端に遅い気がしたので、再起動後に取り直したものを掲載。

ツイート