2012-01-19 10 views
7

このページの作成者を見つける:。http://24ways.org/2011/your-jquery-now-with-less-suckは、jQueryのセレクタ $('#id').find('p')$('#id p')よりも高速であることを主張します私が正しく理解すれば、おそらく同じ結果が出るでしょう。この違いの理由は何ですか? $('#id').find('p')が行うことに最適化されているので

+0

これもテストしましたか? – Tomalak

答えて

6

...

document.getElementById('id').getElementsByTagName('p'); 

...私が利用可能な場合querySelectorAllを使用するか$('#id p')を推測しているのに対し、またはJavaScriptベースのセレクタエンジンではない場合。


パフォーマンスは常にブラウザによって異なります。オペラは、非常に高速のquerySelectorAllを持つことが知られています。

また、さまざまなバージョンのjQueryが異なる最適化を思いつくかもしれません。

$('#id p')(または現在のところ)であり、最初のバージョンと同じ最適化が与えられている可能性があります。

+0

'querySelectorAll( '#id p')'もかなり最適化されていると仮定します。パフォーマンスの違いはテストされていて、アサートされていないことが必要です。 – Tomalak

+1

@Tomalak:私は 'qSA'の十分なテストを行って、ほとんどのブラウザでそれが本当に非常に遅いことを知っています。これはランダムアサーションではありません。 * Opera *に関する私の更新を見てください。 –

+0

私はqSAが常により速いとは言いませんでした。私は*私は*私のポイントを証明するために、実際に*私は言った。結局のところ、jQueryとブラウザのバージョンに大きな違いがあるとすれば、そのような一般化されたステートメントをサポートするのはかなり難しいです。 – Tomalak

2

jQueryが利用可能な場合は、querySelectorAllが使用されるため、ブラウザ固有です。私がWebKitでテストしたとき、それは確かに速かったです。この場合、querySelectorAllが最適化されています。

セレクタ全体が#<id>であり、そのIDを持つドキュメントに要素が1つしかない場合は、getElementByIdに最適化されています。しかし、セレクタが他のものであれば、querySelectorAllは一致する要素を探す文書を横断します。

もちろん、このケースを最適化して同じように実行することは可能ですが、今のところ誰も持っていません。 WebKitソースでhereが見つかり、SelectorDataList::executeSelectorDataList::canUseIdLookupを使用してgetElementByIdを使用するかどうかを決定します。

if (m_selectors.size() != 1) 
    return false; 
if (m_selectors[0].selector->m_match != CSSSelector::Id) 
    return false; 
if (!rootNode->inDocument()) 
    return false; 
if (rootNode->document()->inQuirksMode()) 
    return false; 
if (rootNode->document()->containsMultipleElementsWithId(m_selectors[0].selector->value())) 
    return false; 
return true; 

あなたは非WebKitのブラウザでテストした場合、それは同様の最適化が不足している可能性があります:それはこのようになります。