2 июн. 2012 г.

Сравнение производительности Prototype и jQuery в тестах Dromaeo

Сами тесты находятся по адресу http://dromaeo.com/?jslib. В них проводится сравнение скорости (количества вызовов в секунду) аналогичных методов из Prototype 1.7 и jQuery 1.6.4 в браузерах Chrome 19.0, Firefox 12.0, Opera 11.64, IE 9.

Tests                        Chrome     Firefox    Opera      IE
DOM Attributes:                                                        
addClassName/addClass:       832/ 1417   76/ 1435  328/  902  487/   90
removeClassName/removeClass: 469/ 1265   62/ 1268  292/  800   79/   89
hasClassName/hasClass:       727/ 4457   77/ 3364  416/ 2670  580/ 1950
readAttribute/attr(n):       921/52459  766/39396  260/50000  404/23000
writeAttribute/attr(n, v):   530/  836  368/  754  307/ 1055   73/   81
аналогичные тесты на jsperf.com

DOM Events:                                                            
observe/bind:                485/  541  144/  298  199/  672  208/  311
fire/trigger:                207/    1   93/    1   40/    1  137/    1
stopObserving/unbind:        684/ 1030  195/  915  314/ 2230  267/  880
аналогичные тесты на jsperf.com

DOM Modification:            191/ 509   127/ 339    87/  33    84/ 256
update/html:                 212/ 316   200/ 862   156/ 221   122/ 184
before:                      182/ 581   135/ 443    82/  72    76/ 272
after:                       191/ 576   121/ 234    80/  16    76/ 261
prepend:                     189/ 563   141/ 963    71/  13    76/ 283
append:                      184/ 577    71/  52    69/  11    76/ 296

DOM Style:                                         121/  86   216/  96
getStyle/css(color):         161/10768  194/19254   75/7100   222/5500
setStyle/css(color, red):    134/  530   68/  397   13/ 341   180/ 470
getHeight/height:            168/   12   37/ 1891   58/1310   154/ 160
getWidth/width:              168/   12   33/ 1775   56/1470   155/ 160
visible/is(:visible):       1350/ 1881  675/ 1413  479/ 175   638/ 543
show:                       1298/   98  312/  117  475/ 139   137/  54
hide:                        936/   71  367/  170  297/ 180   542/ 120
toggle:                     6362/   12 1856/  142  203/   1   105/ 319

DOM Traversal:                                     255/  90   172/  38
up/parent:                  1428/2824   722/1124   380/1400   605/1010
ancestors/parents:           731/ 877   372/ 268   345/ 470   298/ 200
previous/prev:               719/2270   349/1329   257/2800   264/ 630
previousSiblings/prevAll:    320/  66   200/  33   258/  28    94/  21
next:                        541/1868   299/1256   244/2450   241/ 540
nextSiblings/nextAll:        344/  60   224/  38   284/  39   109/  24
siblings:                    166/  36   105/  18   100/  16    50/  11
childElements/children:      666/ 981   426/ 430   299/ 565   131/ 118

Анализ результатов

DOM Attributes

Проверка класса CSS (className) в Prototype намного медленнее из-за использования регулярных выражений (jQuery ограничивается поиском указанной подстроки в строке className). Особенно это заметно в Firefox (параллельно делаем вывод, что Firefox работает с регулярными выражениями заметно медленнее остальных браузеров). Однако использование регулярных выражений даёт уникальную возможность проверять наличие сразу многих классов, например element.hasClassName("a|b|c") или element.hasClassName("header\\d") - в jQuery такое невозможно. Как вариант оптимизации можно было бы попробовать поиск подстроки до использования регулярного выражения.

Операции добавления/удаления класса в Prototype вызывают hasClassName, поэтому также имеют поражение в скорости, хотя при добавлении класса можно было бы ограничиться поиском подстроки, т.к. в этом случае аргумент не может быть регулярным выражением.

TODO работа с атрибутами.

DOM Events

Привязка/отвязка наблюдателей событий (bind/unbind) немного быстрее в jQuery (и то не всегда), но самое главное - вызов события (fire/trigger) в jQuery выполняется катастрофически медленно. Для event-driven приложений это не очень хорошо.

DOM Modification

Неожиданный провал jQuery в браузере Opera.

DOM Style

TODO

DOM Traversal

В Prototype необходима оптимизация часто используемых методов up/previous/next (работа над этим уже ведётся, в версии 1.7.0.1 они должны работать быстрее). В jQuery неожиданно медленно выполняется получение коллекции родителей/соседей/потомков (parents, prevAll, nextAll, siblings, children).

Комментариев нет:

Отправить комментарий