高速にCSS SelectorやXPathを処理する (DomQuery、findCSS)

2007年4月23日(月) 12:10

Extベンチマーク
JavaScriptでHTML要素取得をする事が多い。DOMでサポートされる範囲だけでは開発に時間がかかります。DomQueryを利用することで、スタイルシートで記述するのに近い形でHTML要素指定が可能になります。

ブラウザがサポートする方法で処理を行った方が処理速度は速い傾向があります。余計な処理が介入しないので当たり前ですが、開発期間や工数、今後の運用などを考慮した場合ライブラリ導入のメリットは十分にあります。

DomQuery.js

Extフレームワークの一部としてリリースされていますが、単体での利用も可能です(制限あり)。ベンチマークの結果を参照する限りでは、処理速度が最も優れています。

記述例

var obj = Ext.query('#element div');

findCSS.js

FireFoxでDomQuery.jsよりも早い場合がありますが、Internet Explorerでの動作速度はそれほどでもありません。

自分自身の実行環境でベンチマークを行いたい場合は yui-ext.com でベンチマーク行うことができます。完了するまでしばらくかかりますが、どのライブラリを利用するか検討するには非常に参考になります。

EXTライブラリがYUI以外のフレームワークでも利用できるようになったのでExtの対応するフレームワークであれば導入することができます。利用頻度の高いCSSセレクタやXPathなど処理するJavaScriptは高速なものを選びたいですね。

関連する記事