1

したがって、私のアプリでは、ユーザーは特定のdivタグ内にいくつかのコンテンツを作成でき、各コンテンツ、または私がそれらを「要素」と呼んでいるように、独自のオブジェクトがあります。現在、jqueryセレクターを使用して、要素が内部に配置されている元のdivタグを計算する関数を使用していますが、パフォーマンスの観点から、要素が後で計算する代わりに作成されましたか？だから今私はこのようなものを使用しています：

$('.div[value='+divID+']')

しかし、代わりに、要素を作成するときに、要素内に参照を格納することができます。それはパフォーマンスにとってより良いでしょうか？

4

4 に答える 4

4

これらのバインディングがたくさんある場合は、それらへの参照を保存することをお勧めします。コメントで述べたように、変数のルックアップは、特に現在のアプローチでは、DOMでルックアップするよりもはるかに高速です。jQueryセレクターは純粋なDOMの選択肢よりも遅く、その特定のセレクターは非常に遅くなります。

これは、epascarelloによるテストに基づいており、jQuery、DOM2メソッド、および参照の違いを示しています：http: //jsperf.com/test-reference-vs-lookup/2。変数の割り当ては、予想どおり非常に高速です。また、DOMメソッドはjQueryよりも同じくらい大きな差で勝っています。これは例としてYahooのホームページであることに注意してください。

もう1つの考慮事項は、DOMのサイズと複雑さです。これが増えると、参照キャッシング方法はさらに有利になります。

于 2012-08-02T20:59:19.617 に答える
2

ローカル変数は、毎回検索する場合に比べて非常に高速です。それを証明するためにテストします。

于 2012-08-02T21:00:36.327 に答える
1

jQueryは、オブジェクトをビルドして返す関数です。その部分はそれほど高価ではありませんが、実際のDOMルックアップにはかなりの作業が必要です。getElementByIdやgetElementsByClassNameなどの既存のDOMメソッドに一致する単純なクエリ（IE8には存在しないため、非常に遅い）のオーバーヘッドはそれほど高くありませんが、作業（DOMアクセスをラップするオブジェクトの構築）の違いは確かです。メソッド）およびほとんど作業なし（既存のオブジェクトを参照）。再利用を計画している場合は、セレクターの結果を常にキャッシュしてください。

また、使用しているxpathのものは、一部のブラウザーでは非常に高価になる可能性があるため、はい、間違いなくキャッシュします。

注意すべき点：

  • IDのない長い一連のJQパラメータ
  • IE8以下のクラスのみのセレクター（タグ名「div.someClass」などを追加）を大幅に改善-IE8以下では、スピーディーなネイティブメソッドを使用するのではなく、インタープリターレベルですべてのHTMLをヒットする必要があります。クラスを使用する
  • xpathスタイルのクエリ（多くの新しいブラウザはおそらくこれらを問題なく処理します）

セレクターを作成するときは、それに到達するためにどのくらいのマークアップを調べる必要があるかを考慮してください。特定のID内の特定のクラスのdivのみが必要であることがわかっている場合は、$（'div.someClass'）だけでなく、これらの$（'＃theID div.someClass'）のいずれかを実行します。

ただし、それでも、作業回避の原則に基づいて、2回以上使用する場合は、値をキャッシュしてください。また、リクエストを繰り返してDOMを混乱させることはできるだけ避けてください。

于 2012-08-02T21:05:53.760 に答える
0

IDで要素を検索するのは超高速です。私はあなたの他のアプローチを100％理解しているとは思いませんが、要素をそのIDで単純に検索するよりも良いとは思えません。ブラウザは、このタスクを最もよく行う方法を知っています。あなたが説明したことから、私はあなたのアプローチがこれ以上速くなる方法を見ることができません。

于 2012-08-02T20:50:00.730 に答える