7

ナビゲーションを変更するためにjQueryプラグインを作成しました。残念ながら、、などのほとんどすべての子要素にアクセスして変更する必要が<ul>あり<li>ます<a>。これらの要素は、1〜4回必要になります。

それらをすべて変数に格納する必要がありますか、$('.my-nav').find('li')それとも$('.my-nav').find('li')必要に応じてアクセスする必要がありますか?

おそらく25行のコードに対して5つの変数があるのは、メモリの無駄のように思えます。しかし、これがパフォーマンスを向上させるための許容可能なトレードオフであるかどうかはわかりません。

意味を説明するためにフィドルを作成しました:http://jsfiddle.net/Yj35Q/2/

4

3 に答える 3

8

ノードをキャッシュすることは常に良い習慣です。http://jsperf.com/を使用して自分自身をベンチマークすることもできます

大規模なDOMツリーなどを格納する場合を除いて、必要なストレージスペース変数の量について実際に心配する必要はありません。ノードを見つけるためにJSエンジンが実行しなければならない作業の量ははるかに関連性があります。

編集
またはさらに良いことに、他の誰かがすでに作成した既存のテストケースを見つけることができます
http://jsperf.com/ns-jq-cached/4

于 2012-05-07T21:43:48.267 に答える
4

jQueryを使用しているかどうかに関係なく、必要に応じてDOM要素をキャッシュすることをお勧めします。

しかし、この質問は、これを支援するプラグインが必要かもしれないと私に考えさせました。探し回ったのですが見つかりませんでした。

だから私は本当に素早く書いた。これは遅延読み込みのjQueryセレクターです...

(function($){
    var cachedObjects = new Array();

    $.lazy = function(selector) {
        if (typeof selector != "string" || arguments.length > 1) 
            return $.apply(this, arguments);

        var o = cachedObjects[selector];
        if (o == undefined)
        {
            o = $(selector);
            cachedObjects[selector] = o;
        }

        return o;
    };
})(jQuery);

あなたはそれをこのように使うでしょう...

$.lazy('.my-nav').show();

何か見落としがあったら教えてください。ただし、これは、選択している要素が静的であり、動的に追加または削除されない場合に使用すると便利だと思います。

アップデート

これをより効率的にするためにコードを変更しました。return $(selector)そして、セレクターが文字列でない場合に行を追加しました。したがって、キャッシュはセレクターが文字列の場合にのみ機能します。

更新#2

これでreturn $.apply(this, arguments)、jfriend00の提案に従って、単に文字列を渡すのではない場合になります。

于 2012-05-07T22:50:29.353 に答える
2

同じ関数内で、DOM検索の結果をローカル変数にキャッシュするので、同じ関数で同じDOM検索を複数回実行する必要はありません。ほとんどの関数ではこれは必要ありませんが、関数の期間中のみ結果をローカル変数に入れるのは簡単で安全なので、それは良い習慣だと思います。

私は通常、グローバル変数を避けようとしているという理由だけでDOMノードをグローバル変数にキャッシュしません。特定の機能に必要なときにDOMノードを取得することがパフォーマンスの問題になることはめったにありません。グローバル変数にDOM参照が含まれないようにするもう1つの理由は、特定のDOMノードがDOMから削除され、ガベージコレクションを行う場合、グローバル変数にその参照がある場合、DOMノードは削除されないことです。ガベージコレクションが発生し、メモリリークが発生する可能性があります。

同じDOMノードを(タイマーのように)繰り返し検索している場合があります。この場合、DOMノードを関数クロージャの非グローバル変数にキャッシュしてから、その変数をローカルで使用します。しかし、これが必要な場合はまれです。

于 2012-05-07T21:52:39.767 に答える