(IE5で)最速セレクターを作ってみた
cssQueryが非常に遅いので作ってみた。まぁ、古いから仕方ない。
上のslickspeedは、広告が自動挿入されるサイトにおいてあるため、実行すると結果が狂う可能性があります。
各ライブラリごとのまとめ
kQueryは今作っているライブラリの名前。現在はdollarjsという名前です。
探索方法
中はあまり読んでいないので、間違っているかもしれない。
エラー時の値
普通はそんなコード組まないが、不正な(もしくは対応していない)擬似クラスとかが書かれた場合の挙動。
文字列中のカンマへの対応
一番最初にカンマでセレクターを区切っているライブラリのまとめ。「*:contains(",")」とかは書けないので気をつけるべき。ただ、正式なセレクターじゃないため、結果も不定なので、あとで属性セレクター([title*=","]とかで)でテストし直すとして、結果だけまとめておく。
- 正常にカンマもパースできる
- kQuery、jQuery
- 一番最初にカンマで切ってしまう(多分)
- MooTools、YUI、Dojo、Ext
- 実行速度が極度に遅く不明
- cssQuery
- contains未対応のため不明
- Prototype、findCSS、uupaa.js
属性セレクタで実験した結果。
セレクターへの対応状況
- 属性セレクタの正確な対応(class=""というような空文字列への対応)
- PrototypeのみIEでも対応。kQuery、Dojo、uupaa.jsはFirefoxなどgetAttributeでnullが返るときは対応している。他はclass=""では[class]にマッチしない。
- link、lang、root擬似クラス
- kQuery、cssQueryのみ。rootはuupaa.jsも対応。ただ、属性セレクタなどで代替できなくもない。
- nth-last-child、of-type
- kQuery、Prototype、YUI、Dojo、cssQuery、uupaa.js。ただし、Prototype以外は実装に不備があるようだ。特にIEだと顕著にでる。
- target擬似クラス
- kQuery、findCSS、cssQueryが対応。
- not擬似クラス
- Ext、findCSSには不備がある。cssQueryは低速。uupaa.jsは未対応。
他各ライブラリの特徴
- kQuery
- タグ名付きのID絞り込みが遅い。クラス名の絞り込みがFxだと遅い。child、of-typeの擬似要素が遅い。
- jQuery
- 全称セレクター付きのIDが取得できない(普通使わないけど)。重複する要素を削除しない(カンマ区切りは単純に結合する)。対応していないのはきちんとthrowしてくれるから親切。
- Prototype
- クラスに全称セレクターつけるとなぜか速くなる(クラス変えたりして一応試した)。遅くても細かい挙動は非常に丁寧。
- MooTools
- 属性セレクターにスペース含めるとアウト。
- YUI
- 属性セレクターにスペース含めるとアウト。子供セレクターがやたら速い。
- Dojo
- 実はIE5.5でも割と動く。けど、あまり、ちゃんと動かない。
- Ext
- 属性セレクターにスペース含めるとアウト。速い。
- findCSS
- 属性セレクターとか対応していないし、FxとIEとの速度差が大きいのであまりおすすめできないと思う。
- cssQuery
- 遅いけど、サポートしているブラウザが多いのと、割とCSS3に対応している。
- uupaa.js
- IEだとXPathへの変換を含めることも考えると結構遅い。属性セレクターなども地味に対応していないので、CSSセレクターで使うことは避けた方が良い。むしろ、唯一完全にXPath対応しているライブラリなのだから、XPathで運用するのが良い。でも、IDでちゃんと絞り込んだら割とまともな速度で動くような気がしなくもない。
各種ブラウザでのまとめ
IE5
正規表現に(?:...)があるだけで即死したりするので、結局、error無しだったのは3つだけ。うち、findCSSは36foundと何を見つけているのか不明な動作をした。kQueryは動作したcssQueryに対して、おおむね数倍の速度を出したが、child系擬似クラスに限っては遅い。
IE5.5
動作するのは自分のとcssQueryだけなのに丁寧にエラーを返してくれたのはuupaa.jsのみ。残りはgetElementsByTagName("*")辺りの不具合で動いていないだけの感じである。jQueryだけはかたくなに空の配列を返す感じ。dojoは割と動いているのに、ちゃんと動かないこともある不思議挙動。
IE6
全ライブラリが線形探索するブラウザ。Extに少し負けた。first-childがやたら遅いことが気になる。
Fx
あとでやる。
Opera
あとでやる。
Safari
環境無いから無理。
Google Chrome
Selectors API対応しているからそれ使おう。