2007-10-23

Prototype $$ メソッドを jQuery Selector で置き換えてみる

prototype.js の開発者向けメモ $$() 関数を使う の中で、次のとおり、使い方によってはパフォーマンスに影響するので $$ 関数の置き換えを検討してはどうかとあります。
パフォーマンスについてちょっと記しておきます。 prototype.js の $$() 関数の現在の実装では、特に効率的な実装を重視しているわけではありません。この関数を頻繁に使って、深く複雑な HTML 文書を処理しようとしているのなら、単純に $$() 関数自体を置き換えることができる、他のフリーの実装を検討した方がいいかもしれません。
$$() 関数の CSS Selector と似たものといえば jQuery が思いつくので、次のとおり $$() 関数を jQuery の Selector の実装で置き換えてみました。
<script type="text/javascript">
//<![CDATA[
function $$() {
var elements = [];
$A(arguments).each(function(expr) {
elements = elements.concat($A(jQuery(expr)));
});
return elements.map(function(element) {
return Element.extend(element);
});
}
//]]>
</script>
$$() 関数の引数 (Selector 記述) を jQuery で繰り返し、その選択した要素の配列を返します。このとき Element.extend を使って要素を拡張しています。

Prototype と jQuery は相性(衝突)の問題がありますが、jQuery は 利用者の判断で回避できるような仕組み を提供しています。

Ajaxハッカーズ・プログラミング―基礎からprototype.js、Yahoo!UIライブラリ、HTML_AJAXの活用までWebアプリケーション制作のプログラミング・テクニックAjaxハッカーズ・プログラミング―基礎からprototype.js、Yahoo!UIライブラリ、HTML_AJAXの活用までWebアプリケーション制作のプログラミング・テクニック
佐久嶋 ひろみ

サーバサイドAjax入門 Java/PHP/ASP.NET連携でAjaxプログラミングを極める! まるごとJavaScript & Ajax ! Vol.1 基礎 Ajax + JavaScript Ajaxイン・アクション Ajaxライブラリリファレンス

by G-Tools

0 件のコメント: