問題

私は最近、jQueryのパフォーマンスに関するいくつかの記事を読んで、私はいくつかの奇妙な質問を思いついた。

  • $(window)をキャッシュできますか?

    私がした場合、resizescrollwidthscrollTop ...などに影響しますか?

  • $(document)をキャッシュすることはできますか?

    多くのマウスアクションを使用するので、var doc = $(document);を実行する必要がありますか?

  • 大きなコードブロックで常に$(this)をキャッシュできますか?

    var self = $(this);については、self$(this)とどのような条件で異なる可能性がありますか?

  ベストアンサー

3つの質問すべて:はい、できます!

いいえ

より良いパフォーマンス:多分

ベンチマークを試してみることができます。しかし、キャッシュの理由は、セレクタのDOM全体を検索することではありません。ドキュメントとウィンドウを検索することは、2つのルート変数であるため問題ではありません。キャッシング$(this)は状況に依存します。私の2番目のヒントを参照してください。

クエリを実行する親オブジェクトを常にキャッシュします。

 var header = $('#header');

var menu = header.find('.menu');
// or
var menu = $('.menu', header);
 

セレクタをキャッシュするよりもjQueryメソッドを連鎖させる方が良いでしょう:

 $('li.menu-item').click(function () {alert('test click');})
                     .css('display', 'block')
                     .css('color', 'red')
                     fadeTo(2, 0.7);
 

頻繁にクエリする要素をキャッシュします。

 var header = $('#header');
var divs = header.find('div');
var forms = header.find('form');
 

余分なパフォーマンスのヒント:

セレクタが最も遅くなる:

 Id > Tag > classes
 

  同じタグがついた質問を見る

jqueryperformancecaching