я должен заботиться об этом виде оптимизации - JQuery - DOM изменения - PullRequest
0 голосов
/ 23 июля 2011

У меня простой вопрос, стоит ли «кэшировать» DOM изменения даже снаружи, если цикл (для цикла, ..) в случае, например, у меня есть. 1000 предстоящих изменений делают огромный прирост производительности (как я слышал, я не измерял себя), но что, если я заменяю только контент таким образом?

jQuery("#subMenu").html( jQuery( html ).find( "#subMenu" ).html() );
jQuery("#pageMain").html( jQuery( html ).find( "#pageMain" ).html());
jQuery("#text").html( jQuery( html ).find( "#text" ).html());   

Я могу сделать это

var cachedDOM = jQuery("body").html(); //edited
jQuery(cachedDOM).find("#pageMain").html( jQuery( html ).find( "#pageMain" ).html());
jQuery("body").html(cachedDOM);

Это было бы вероятно быстрее, но мне нужно, чем перепроверить все мои события и так далее ... Это действительно лучший подход для кэширования DOM в этом случае? Я так не думаю, но я бы хотел сделать страницу максимально быстрой (особенно в старых IE)

Спасибо

Ответы [ 2 ]

2 голосов
/ 23 июля 2011

Ваш второй код даже не с тех пор.

$var cachedDOM = jQuery("body").html();

Я думаю, что вы имели в виду

var $cachedDOM = jQuery("body").html();

Тогда эта строка:

jQuery(cachedDOM) относительно медленно

Вы эффективно клонируете весь HTML-код своей веб-страницы в этой строке, поэтому вы можете осуществлять поиск по ней, как обычный DOM,Было бы намного быстрее использовать ваш первый метод.Я думаю, что тип кэширования, который вы ищете, который дает увеличение переменной скорости, выглядит примерно так:

var $body = jQuery("body");
$body.find("#pageMain").html($body.find("#pageMain").html());

Увеличение скорости зависит от того, насколько сложен селектор.Например, поскольку большинство версий IE не имеют функции document.getElementsByClassName() для использования jQuery, селектор с большим количеством классов будет работать довольно медленно и будет хорошей идеей кэшировать результат.Примером этого является: jQuery("div.left-column.highlighted li.link-list a.active"); Если вы выполните такую ​​строку 1000 раз в IE с довольно сложным DOM по сравнению с кэшированием один раз и с использованием кэша 999 раз, вы можете получить заметную разницу в скорости.

1 голос
/ 23 июля 2011

Всегда используйте встроенные селекторы JQuery против попыток «кэширования» и обхода переменной. В любом случае, начинать свой обход с тела нелогично.

Доказательство того, что селекторы смехотворно быстрее псевдокэширования: http://jsperf.com/pseudo-dom-cache

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