Вопрос о производительности jQuery и DOM: почему один метод быстрее другого? - PullRequest
Новая
       23

Вопрос о производительности jQuery и DOM: почему один метод быстрее другого?

0 голосов
/ 07 августа 2009

Я просматривал некоторые советы по производительности jQuery и наткнулся на этот, который заинтересовал меня.

Проверьте следующий фрагмент страницы: 

<html>
<head>
</head>
<body>
<select id ="myList">


</select>
<div id ="myList2">


</div>
<script language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function()
{
    console.time('test');
    var myList = $('#myList');
    var myListItems = '';

    for (i = 0; i < 1000; i++) {
        myListItems += '<option>This is list item ' + i + '</option>';
    }

    myList.html(myListItems);
    console.timeEnd('test');

    console.time('test2');
    var myList = $('#myList2');
    var myListItems = '<select  >';

    for (i = 0; i < 1000; i++) {
        myListItems += '<option>This is list item ' + i + '</option>';
    }

    myListItems += '</select>';
    myList.html(myListItems);
    console.timeEnd('test2');

}
);
</script>
</body>
</html>

Почему второй метод испытаний быстрее, чем первый (примерно в 4 раза)?

Ответы [ 3 ]

1 голос
/ 07 августа 2009

Хорошо, я думаю, что могу получить это.

При первом варианте мы добавляем 1000 объектов DOM к одному объекту DOM.

Со вторым параметром мы добавляем 1 объект DOM с 1000 объектами DOM к одному объекту DOM. Таким образом, мы подключаем только один объект DOM к другому вместо 1000?

Я правильно думаю? В коробку легче положить мешок с 1000 шариками, чем в мешок 1000 шариков?

0 голосов
/ 07 августа 2009

Вы правильно поняли.

Добавление нескольких раз к элементу DOM повышает производительность, чем добавление один раз.

P.S. : Прямой код много раз не отображается линейно.

0 голосов
/ 07 августа 2009

myList.html анализирует (и, следовательно, проверяет) входные данные, тогда как первый тест - нет. Он просто выплевывает строку.

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

Нет похожих вопросов

...