jQueryのselectorで要素取得スピード比較
classでとってくるより、idでとってきた方が速いに決まってるけどどのくらい？と思ったのでちょっとテスト。100kbぐらいあるHTMLファイルの中から、要素を取得するスピードを計ってみる。jQueryのselector使って。
以下はjQuery1.2.6で、各要素を100回とってきたときの、Firefox3でのスピード。
| $("#ID") | 5 msec |
|---|---|
| $(".className") | 3078 msec |
| $("p.className") | 971 msec |
| $("p") | 701 msec |
classのほうは、getElementsByTagNameでごにょごにょごにょやっているはずだけど、600倍近くも速いとは。可能な限りIDでいろいろやった方がいいのがよく分かった。classでとってくるときも要素指定すると全然違うんだ。以下はIE7でおなじことやった結果。
| $("#ID") | 94 msec |
|---|---|
| $(".className") | 10145 msec |
| $("p.className") | 6384 msec |
| $("p") | 2859 msec |
おそー。でも100倍ぐらい違うってことなんですね。ページ内の要素数にもよると思うけど。
This article is about... JavaScript , jQuery
- コメントを書く
- TrackBack URL （この記事についてトラックバックしたい時は以下のURLを指定してください）
- http://gyauza.egoism.jp/cgi/mt/mt-tb.cgi/2018