Сами тесты находятся по адресу 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
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
writeAttribute/attr(n, v): 530/ 836 368/ 754 307/ 1055 73/ 81
DOM Events:
observe/bind: 485/ 541 144/ 298 199/ 672 208/ 311
fire/trigger: 207/ 1 93/ 1 40/ 1 137/ 1
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
Комментариев нет:
Отправить комментарий