IT戦記

プログラミング、起業などについて書いているプログラマーのブログです😚

XPath は jQuery や Prototype.js と競合する技術ではなく、むしろ共存する技術です

昨日のエントリのブクマやコメントで

のようなコメントがありました。

これらのコメントから

おそらく、「XPathjQueryYUIPrototype.jsDojoMochiKit などの汎用 JS ライブラリと競合する」と思ってる方が多いのかなと思いました。

結論

XPath は汎用 JS ライブラリとは競合する技術ではなく、共存する技術だと僕は考えています。

理由

汎用的な JS のライブラリには、大きく以下のような機能があります。
それに対して XPath が提供するのは
  • DOM ツリー上の要素やノードを取得する

というシンプルな機能だけです。
つまり、 XPath は汎用 JS ライブラリではないのです。

では、 XPath は何なのか

XPath は既存のライブラリ、新しいライブラリ、私製ライブラリの「要素取得機能」として組み込んで使うものになると僕は考えています。

なので

今、 jQueryPrototype.js にどういう風に XPath を組み込んで(バインディングして)使うのがキレイかを考えています。

例えば、 jQuery なら
$('//form')
  .xpath('.//input[@checked="checked"]')
    .addClass('checked')
  .end()
  .xpath('.//input[not(@checked="checked")]')
    .addClass('checked')
  .end()

このような使い方が出来るようなバインディングを提供すべきでしょうし、

また、 Prototype.jsScriptaculous なら
Event.observe('//div/a[@href="http://coderepos.org/share"]', 'click', function(e) { /* event handler */ })

$x('//div').invoke('visualEffect', 'opacity', { from: 1, to: 0 });

このような使い方が出来るようなバインディングを提供すべきでしょう。

このような様々なライブラリへのバインディング

今後、僕自身も作っていく予定ですし、様々なユーザが CodeRepos に提供してくれるのではないかと考えています。

XPath が今までの要素取得機能と比べて何が良いのか

ここまで、 XPath が汎用 JS ライブラリと競合するものではなく共存するものだと述べてきましたが、共存させるメリットとは何なのでしょうか。

XPath は、ある要素(やノード)があった場合に id や class の有無に関わらず確実に一つまたは複数の要素を特定出来る。

多くのライブラリでは「CSS セレクタ」を使っていますが、 CSS セレクタには

  • 親を遡るセレクタを記述出来ない
  • 数式や文字列の結合や比較などのプログラミング的な機能がない

などの問題があります。
その点 XPath では、それらの機能を駆使して確実に要素を特定することができます。

XPathXPath 1.0 として、DOM から使う方法は DOM 3 XPath として、それぞれ標準化されている*1

現状の汎用ライブラリの要素取得機能は、ほぼ標準的な「CSS セレクタ」を使っていますが、その実装はかなりまちまちで、独自的なものになっています。
その点 XPath の場合は、一つの XPath だけを覚えていればいいのです。
また、要素取得機能に関しては特定ライブラリに依存しなくなり、他のライブラリへの移行コストが少なくなります。

XPath がネイティブ実装されているブラウザでは非常に高速である。

ネイティブ実装されている XPath は非常に高速です。汎用ライブラリのそれと比べても数倍〜の速度です。
そして、現在ネイティブ実装されていないブラウザでも、将来ネイティブに実装される可能性はあります。

JavaScript-XPath でもそれなりに高速である。

また、そのうちキチンとしたスピードの測定を公開したいと思いますが、 JavaScript-XPath の(特に IE での)速度は他の汎用ライブラリと比べても遜色のないスピードです。

このように、 XPath を使うメリットは山ほどあります。

まとめ

という訳で、 XPath は決してライブラリと競合するものではないのです。
みなさん、今使っているライブラリの追加機能として XPath はいかがでしょうか?

*1:CSS セレクタも標準化されつつあるが、キチンと実装したライブラリ、ブラウザがない