Dziudek's jogger

Wiele razy w sieci spotykałem się z twierdzeniami, że jQuery jest o wiele szybsze od mootools... Nie ukrywam, że nawet już się chciałem z tym faktem pogodzić, ale nic bardziej mylnego... Na blogu jQuery pojawił się wpis z okazji wydania wersji 1.1.3 i pojawiło się wraz z nim porównanie wydajności jQuery i innych frameworków JS. Jeżeli obejrzycie tabelki to z pewnością się lekko zdziwią zwłaszcza zwolennicy tezy o wyższości jQuery nad mootools w kwestii wydajności ;) Ale nie byłbym sobą gdybym nie przeprowadził tego samego testu u siebie ... Zmieniła się jednak testowana ekipa i lekkiej zmianie uległ zestaw przeglądarek - Safari 2 jest u mnie zastąpione Safari 3.0.2 dla Windows.

Zapraszam na moją analizę uzyskanych wyników ;) Gdyby ktoś chciał sobie sam przeprowadzić ten test to zapraszam pod ten adres.

O co w ogóle chodzi i jak przebiegał test

Zacznijmy w ogóle od tego o co w tym teście chodzi. W teście został użyty skrypt SlickSpeed. Test został przeprowadzony na moim wysłużonym komputerze (Celeron 533MHz, 256MB SDRAM - to w sumie wystarczy ;] ). Użyłem czterech przeglądarek - IE6, Opery 9.2, FIrefoxa 2.0.0.4 oraz wspomnianego Safari 3.0.2 . W czasie testu by uniknąć jakichś zakłóceń wyłączyłem wszelkie zbędne programy (komunikatory, i inne otwarte okna) i wyszedłem na herbatę by zbędnie nie ruszać myszką ;D

Test sprawdza wydajność frameworków JS w zakresie selekcji elementów z testowego dokumentu. Selekcja elementów z drzewa dokumentu to właściwie podstawa działania jakichkolwiek większych skryptów JS i od niej w dużym stopniu zależy wydajność skryptu.

Wyniki

Bez zbędnych ceregieli przejdę do samych wyników - zamieszczam screeny uzyskanych rezultatów gdyż mam świadomość, że nie każdy ma czas na testowanie tego wszystkiego u siebie ;)

• Internet Explorer 6
• Firefox 2.0.0.4
• Opera 9.2
• Safari 3.0.2

Dodać należy, że użyłem najnowszego jQuery (spakowanego i niespakowanego) oraz mootools 1.11 (kompresowanego z użyciem JSMin i skryptu PHP) oraz najnowszego mootools z SVN dostępnego w dniu testów(test robiłem parę dni temu więc jest już nowsza wersja mootools z SVN). Dodatkowo zostawiłem standardowe frameworki dostarczone ze skryptem do testów.

O rezultatach

Wnioski jakie wyciągnąłem z prezentowanych rezultatów:

• Zdecydowanie najwolniejszy z całej stawki jest cssQuery - jest wielokrotnie wolniejszy od czołówki.
• Mootools 1.11 nie obsługuje sporej ilości selektorów - w najnowszym Mootools nastąpiła w tej kwestii ogromna poprawa.
• Jedyne frameworki jakie obsługują wszystkie selektory to prototype i jQuery z tym, że pod IE proptotype pada w dwóch selektorach - a więc jeśli chodzi o kompatybilność z przeglądarkami i obsługę selektorów jQuery jest zdecydowanym liderem.
• Największe rozbieżności w ilości wyselekcjonowanych elementów występują w IE (17 selektorów), a najmniejsze w Operze (12 selektorów) - Firefox i Safari - 13 selektorów...
• Najszybciej w testach wypadają Safari i Opera - Firefox odstaje od nich dość znacznie, a IE wypada wręcz tragicznie (80 sekund na cały test dla cssQuery mówi samo za siebie).
• W Operze widać dość znaczne różnice pomiędzy wersjami upakowanymi i tymi mniej upchanymi jeśli chodzi o jQuery i mootools. Na pozostałych przeglądarkach nie widać tak znacznych różnic.
• Mootools w najnowszej wersji jest szybszy od jQuery we wszystkich przeglądarkach poza IE, gdzie jQuery jest prawie dwa razy szybsze. Celowo nie porównuję tutaj mootools 1.11 z jQuery ponieważ nie zwraca ono wyników ze zbyt wielu selektorów co ma dość znaczny wpływ na końcowy wynik.
• Prototype ma zbliżone rezultaty do mootools. Na Safari i Operze jest nawet wyraźnie szybsze.

Podsumowanie

Przede wszystkim wyniki w znacznym stopniu pokrywają się jeśli chodzi o ranking z wynikami prezentowanymi na blogu jQuery - różnice występują tylko u mnie w IE - Dojo jest szybsze od jQuery, ale pomija parę selektorów więc można uznać jQuery za lidera . W safari 3 wyraźnemu przyśpieszeniu uległa praca mootools i prototype - oba prześcignęły jQuery.

Widać wyraźnie, że każdy z frameworków ma swoje mocne i słabsze strony - poza cssQuery, który bardzo odstaje od reszty. jQuery obsługuje wszystkie selektory, ale jest dwa razy wolniejsze od najnowszego mootools pod Firefoksem i Operą (pod Operą właściwie 1.5 raza). Prototype, dojo i ext też całkiem przyzwoicie się prezentują i momentami prześcigają i mootools i jQuery.

Reasumując - twierdzenie, że jQuery jest o wiele wydajniejsze od mootools jest nie do końca prawdą (poza IE) i moim zdaniem nie powinno się go stosować jako argumentu do przekonywania ludzi do danej biblioteki... Jaka jest dobra wiadomość ? Widać, że jest kilka frameworków, które mieszczą się w granicach przyzwoitości jeśli chodzi o wydajność, a co za tym idzie mamy szeroki wybór narzędzi wspomagających pisanie nierzadko całych aplikacji w JS. Nie musimy się przy tym obawiać, że bardzo dużo stracimy na wydajności w stosunku do innych frameworków (poza cssQuery ;) ).