38

なぜそれが起こっているのか理解できません。

私はここでそれを読んだ：

最初の$.eachは、反復子を開始する単一の関数呼び出しを構成します。

2 番目の$(foo.vals).eachは、反復子を開始するために3 つの関数呼び出しを行います。

  • 1 つ目は、新しい jQuery ラッパー セットを生成する $() です (このプロセス中に他の関数呼び出しがいくつ行われるかはわかりません)。
  • 次に、$().each を呼び出します。
  • 最後に、jQuery.each への内部呼び出しを行い、反復子を開始します。

あなたの例では、違いは控えめに言ってもごくわずかです。ただし、ネストされた使用シナリオでは、パフォーマンスが問題になることがあります。

最後に、jQuery Enlightenment の Cody Lindley は、関数呼び出しが関係しているため、1000 回を超える繰り返しに $.each を使用することを推奨していません。通常の for( var i = 0... ループを使用します。

だから私はこの jsperf でそれをテストしました:

(タスク : チェックボックスをオンにしている Tr を見つけて、その tr に色を付けます。)

これはjsbinです

しかし、jsperfを見てください

すべての予想に反して、その反対が真実です。(クロムと FF と IE)

ここに画像の説明を入力

3 つのメソッドを呼び出す (を使用する人$().eachが最も速いなど。

ここで何が起こっているのですか？

4

3 に答える 3

38

テストが重すぎて、3 つのループ オプション間の実際の違いを実際に判断できません。

ループをテストしたい場合は、できるだけ多くの無関係な作業をテストから取り除くために最善を尽くす必要があります。

現状では、テストには次のものが含まれます。

  • DOM 選択
  • DOM トラバーサル
  • 元素変異

これらはすべて、ループ自体に比べて非常にコストのかかる操作です。余分なものを取り除くと、ループ間の違いがより明確になります。

http://jsperf.com/asdasda223/4

Firefox と Chrome の両方で、forループは他のものよりも 100 倍以上高速です。

ここに画像の説明を入力

于 2013-02-11T08:56:03.820 に答える
3

良い

  • $.each()リストを反復するために使用される実行中のjQuery関数であるため、オーバーヘッドはjQuery関数であり、リスト内のすべてのアイテムに対してその関数を呼び出すオーバーヘッドです。この場合
  • $(thing).each()この背後にある考え方は、$(thing)が jQuery インスタンスを作成してから、このインスタンスを反復処理する (.eachそのインスタンスに作用する) というものです。あなたの場合、あなたがそれを呼び出したインスタンスはすでにjQueryオブジェクトであるため、オーバーヘッドは最小限です(あなたはインスタンスですか、そうです)。
  • for()この場合、反復ごとにリストの長さを調べることを除いて、オーバーヘッドはまったくありません。

次のことを検討してください。

var l = g.length;
for (var i=0;i<l;i++) {
    // code;
}

HTML によっては、ほとんどの場合、Sizzle Jquery パーサーがドキュメント内のセレクターを見つける可能性があります。

また、あなたのセレクターが最適だとは思わないことに注意してください。最近大幅に変更された場合を除き、jQuery セレクターは右から左に評価され.find()ます。次に、ドキュメントのサブセットのみを検索します。

于 2013-02-11T08:40:03.013 に答える
0

「タスク」への異なるアプローチhttp://jsfiddle.net/ADMnj/17/

しかし、パフォーマンスの問題は、正しい問題で状態セレクターを使用しないことから来ていると思います

#t tr input:checkbox:checked 

VS

#t tr :checkbox:checked

チェックボックスがチェックされているかどうかを確認する正しい方法は、次のように呼び出すことです。

#t tr input[checked="checked"]

W3.ORGのセレクターリストはE[foo]を参照してください

そして最後になりましたが、最速はコードが最も短いものでもあります。これは、3行と4行および5行のコードで得られるパフォーマンスがわずかに異なる可能性がありますが、この事実を証明することはできません。

于 2013-02-11T09:24:52.963 に答える