2013-07-19 11 views
10

Próbowałem znaleźć odpowiedź i znalazłem pokrewne pytanie, a gdy potwierdzają moje wyniki (that one multiple selector call is slower than multiple single selector calls), nikt z nich nie powiedział mi dlaczego.Działanie wielokrotnego selektora a pojedynczego selektora

w zasadzie, po uruchomieniu tego kodu:

$("#one, #two").hide(); 
$("#one, #two").show(); 

Przeciwko ten kod:

$("#one").hide(); 
$("#two").hide(); 
$("#one").show(); 
$("#two").show(); 

Następnie ten ostatni będzie szybszy o około 50%.

Jednak po dodaniu trzeciego selektora różnica w wydajności jest o 39% większa.

Czwarta różnica selektora: 26% szybciej.

Po piąte: 30% szybciej.

Po szóste: 31% szybciej.

Dziesięć: szybciej o 31%.

(należy pamiętać, te wartości wydają się wahać w około marginesem 5%)

więc mamy coś, co wygląda tak:

enter image description here

Spektakl wydaje się plateau około 6 selektorów. Wydaje się, że nigdy nie jest tak "szybszy" niż 31% wolniej niż wykonywanie każdego z nich za pomocą pojedynczego połączenia. Dlaczego tak jest?

Osobiście uwielbiam używać wielu selektorów na połączenie, ale wydaje się, że ma (stosunkowo) duży hit wydajności. Kiedy to (nie) byłoby odpowiednie do użycia?

+1

Interesujące. Zawsze zakładałem, że pierwszy przypadek (wielokrotność) będzie szybszy. A co z selektorami klas, podobną wydajnością? –

+0

Takie też było moje założenie, więc byłem tym zaskoczony. Nie sprawdzałem selektorów klasowych, ale warto się przyjrzeć. Przeprowadzę później testy. – Johannes

+0

Nie jestem pewien co do * stosunkowo dużego *. 50% szybszy nie będzie oznaczać wiele w dużym obrazie, jeśli kod odniesienia już działa w ciągu mikrosekundy. –

Odpowiedz

4

W obu przypadkach używasz identyfikatorów, aby można było przekonwertować je na macierzystą rozmowę getElementById.

Jednak, w 1 przypadku 2 dodatkowe rzeczy muszą być zrobione

  1. śpiączki muszą być przetwarzane, więc jest dodatkowy parsowanie zaangażowany
  2. W 2 wyniki muszą być połączone, przez który Działanie jQuery asserts that they are returned in the same order as in DOM

Przypuszczam, że druga operacja zajmuje najwięcej czasu.