レベルエンター山本大のブログ

面白いプログラミング教育を若い人たちに

BLOCKVROCKリファレンス目次はこちら

Google Chromeのパフォーマンス測定

Google Chromeは、起動がやたら早いことが好印象だ。


Googleらしいシンプルさも良いし、安定感も抜群。


タスクマネージャーや、Javascriptデバッグコンソールを組み込んでいるところなんかも気が利いてる。


さて、JavaScriptが速いのは体感的にわかるが、いったいどれぐらい速いんだろうか?


以前に、FireFox3の性能について調べたやり方で、Chromeを調べてみる。
FireFox3とIE6で、Elementの取得において最高速なのは? - 山本大の日記


Dom操作の中でも、基本的なElementの取得についての検証であり、


やり方は前回と同じ。


以下のようなコードで、cnt変数の数を変化させながらdocument.getElementById()の速さを調べた。

<html><script type="text/javascript">
<!--
window.onload = function(){
	var cnt = 10000; 
	var parentDiv = document.getElementById("d");
	for (i = 0;i < cnt;i++){
		var elem = document.createElement("div");
		elem.id = "d" + i;
		elem.name = "d" + i;
		parentDiv.appendChild(elem);
	}
	var startdate = new Date();
	for (i = 0;i < cnt;i++){
		var elem = document.getElementById("d" + i);
	}
	var diff = new Date() - startdate;
	alert(diff)
}
-->
</script>
<body>
<form name="d" >
	<div id="d">
</form>
</body></html>


結果は以下の通り。

回数 IE6 FF Chrome
100回 0 2 1
1000回 563 18 8
5000回 20594 65 32
10000回 74656 132 130


IEは最新バージョンを使ってないので、フェアじゃないが、
プロジェクトの都合で、僕の環境ではIE7を入れたくないのでご容赦ください。


FireFox3も、たいがい速かったがChromの速さはそれを若干上回る勢いだ。


div要素5000個程度なら、FireFox3の倍のスピードだった。
(ただし方法がテキトーなので、ベンチマークの精度としてはあてにならないと思ってください)


FireFoxの便利なプラグインは魅力だけど、Chromeの起動の速さも捨てがたいな。