Меньшая область действия, но меньшая производительность в jQuery? - PullRequest
2 голосов
/ 20 сентября 2011

Я создал jsfiddle здесь: http://jsfiddle.net/2tfbs/1/

Поскольку область действия 'find' меньше в нижнем цикле, почему скорость намного ниже?Если вы изменяете версии jQuery, то наблюдается скачок в производительности (огромный в Firefox 5) начиная с 1.4.4 и далее, но во всех версиях вывод в основном одинаков.

Если вы измените первый цикл на простой$ ('# container'), а не кэшированная переменная, результат также тот же и, казалось бы, противоречит всему, что я прочитал, что говорит: «Кэширование быстрее».

Я что-то не так делаю?Я не понимаю, что происходит.

Редактировать: код из jsfiddle

html:

<div id="container">
    <div class="post">
        <div class="content">
            <span></span>
        </div>
        <div class="meta">
            <span></span>
        </div>
    </div>
    +2 more iterations of a post block
</div>

js:

//first loop
var $container = $('#container');
var i = 1000,
    a, start1 = new Date();
while (i--) {
    a = $container.find('div.content');
}
var end1 = new Date();
$('#one').text((end1 - start1) / 1000);

//second loop
var $post = $container.find('div.post');
var j = 1000,
    b, start2 = new Date();
while (j--) {
    b = $post.find('div.content');
}
var end2 = new Date();
$('#two').text((end2 - start2) / 1000);

1 Ответ

2 голосов
/ 20 сентября 2011

Поскольку вы запускаете find() для нескольких элементов во втором цикле.

В первом цикле ваш селектор соответствует одному элементу (у вас есть один #container).Во втором цикле ваш селектор соответствует нескольким элементам (у вас есть множество div.content).Больше элементов означает больше соответствия означает больше циклов.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...