Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Общие вопросы > Производительнее переменная или getElementById?


Автор: Иль 31.5.2005, 15:31
По скрипту получается, что в переменной теряется ссылка на нужную ноду документа.
Как считаете, что лучше, создать новую переменную и заранее сохранить в ней ссылку на ноду или лишний раз вызвать document.getElementById("q"). Сам считаю, что производительнее создать переменную, тк наслышан, что DOM медлител, да и код получается компактнее.

Я конечно понимаю, что это мелочи и что сборщик мусора все подчистит, но интересно.

Автор: diam 31.5.2005, 15:43
Если честно, я разницы в скорости не ощущаю особо.
Когда загрузится вся страница - всё летает.
Поэтому я бы исходил из соображений удобства.IMHO.

Автор: sergejzr 31.5.2005, 15:51
У нас в ФАКе есть пример таймера. Поэксперементируй на разных браузерах и выложи сюда результат. Интересно посмотреть будет smile
Добавлено @ 15:56
http://vingrad.ru/JAVASCRIPT-JS-001270

Автор: Иль 31.5.2005, 16:23
Цитата(diam @ 31.5.2005, 15:43)
Поэтому я бы исходил из соображений удобства

Да я тоже так делаю, но хочется чуток подумнеть smile

А и правда, сейчас протестю через функцию, чтоб сборщик мусора также задействовать. Сейчас только условия придумаю...

Автор: Иль 31.5.2005, 17:10
И вот, что я вам скажу: переменная и сборщик мусора форева.
Итог 1 - лучше лишняя переменная, чем лишний раз DOM дергать.
Итог 2 - лучше с десяток глобальных переменных с сылками на нужные и всегда существующие ноды заранее создать, чем в каждой функции document.getElementById("ид") на них применять.

В коде ниже проверте на адекватность мои функции s1 и s2
Код
<html><head><meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head><body onclick="st()">
<div><div id="elem"></div></div>
<div id="mele"></div>
<script language='JavaScript' type="text/javascript">
function difference(date1,date2)
{
var ret = new Date(); //Возвращаемый обьект с разницей времени
ret.setTime(Math.abs(date1.getTime() - date2.getTime()));//Заряжаем обьект разницей
return ret;
}

//Превращаем обьект в строку
function printDate(date)
{
return date.getMinutes()+" мин:"+date.getSeconds()+"сек:"+date.getMilliseconds()+" мс.";
}

//Возможно распечатать ручками :)
function printDate_alternative(date)
{
timediff = date.getTime();
//Полные недели 604800000=1000 * 60 * 60 * 24 * 7
weeks = Math.floor(timediff / (604800000));
timediff -= weeks * (604800000);
//Полные дни 86400000=1000 * 60 * 60 * 24
days = Math.floor(timediff / (86400000));
timediff -= days * (86400000);
//Полные часы 3600000=1000 * 60 * 60
hours = Math.floor(timediff / (3600000));
timediff -= hours * (3600000);
//Полные минуты 60000=1000 * 60
mins = Math.floor(timediff / (60000));
timediff -= mins * (60000);
//Полные секунды
secs = Math.floor(timediff / 1000);
timediff -= secs * 1000;
//Остались лишь милисекунды

return weeks + " недели, " + days + " дни, " + hours + " часы, " + mins + " минуты " + secs + " секунды "+timediff+" миллисекунды";
}

function s1(){
var t=e,s;
s=t.appendChild(y.cloneNode(false))
s.parentNode.removeChild(s)
}
function s2(){
var s;
s=document.getElementById("elem").appendChild(y.cloneNode(false))
s.parentNode.removeChild(s)
}
function st(){
e=document.getElementById("elem")
y=document.getElementById("mele")
d11=new Date();
for(var t=0;t<1000;t++)s1();
d2 = new Date();

for(var t=0;t<1000;t++)s2();
d22 = new Date();

alert("C переменной: "+printDate(difference(d11,d2))+"\nС getElementById: "+printDate(difference(d2,d22)));
}
</script></body></html>

Sardar, хотел в твоем топике запостить (про обсуждение о топике про прототипы, объекты и переменные), но потом подумал, что не в тему. А теперь думаю, что вроде и пригодится, если, конечно выводы сделал правильные.

Автор: sergejzr 31.5.2005, 17:12
ээээ А результаты покажешь? smile

Автор: Иль 31.5.2005, 17:19
Цитата(sergej @ 31.5.2005, 17:12)
ээээ А результаты покажешь?

Ребят, да я там в функциях s1 и s2 столько лишних тяжолых операций намутил, что результаты не совсем адекватны, но вот они

браузер - переменная на getElementById
ИЕ - 210 на 250мс - средее значении при стабильной дельте
FF - 280 на 297мс - значение стабильное при стабильной же дельте (ой, а разница то минимальна smile )

Автор: sergejzr 31.5.2005, 17:24
Ну чего то такого следовало ожидать в принципе...

Предположу однако, что
appendChild
сloneNode
removeChild

Занимают большинство времени.

Автор: Иль 31.5.2005, 17:31
Цитата(sergej @ 31.5.2005, 17:24)
Предположу однако, что

А ведь если это учесть, то получается, что разница в результатах сильно возврастет. Сейчас попробую облегчить код и проверить
Добавлено @ 17:38
Я в шоке. Может я чего не так делаю, может сборщик мусора нас всех обхитрил smile

Я вот так изменил тестовые функции
Код

function s1(){
var t=e,s;
s=t
}
function s2(){
var s;
s=document.getElementById("elem")
}

и получается, что на переменную уходит стабильно 0мс, а на getElementById 30-45мс и в ИЕ и в Лисе

Автор: Sardar 31.5.2005, 17:47
Естествено сохранив ссылку в переменной мы получим прирост производительности. Но это актуально для анимаций, что на JS редко делаються, в обычных скриптах скорость(пара миллисекунд) не так важна, потому не сохраняю ссылок.

Если фанатично подойти к скорости, то не нужно создавать собственных обьектов, ведь на поиск переменной по имени и в полях требуеться время, т.е.
Код
var a={bla: "aaa"};
var b="test"; //это будет быстрее
a.bla="test"; //чем это... на пару микросекунд... =)

Автор: Иль 31.5.2005, 17:50
Не, все верно. Увеличил число итераций на два нуля (в строковом представлении smile ) и разница возрасла так:

ИЕ - 450 на 3000мс
FF - 220 на 3300мс

Автор: sergejzr 31.5.2005, 17:53
50 мс/1000 = .05 микросекунд на ссылку ИМХО таким можно и пренебреч smile
Добавлено @ 17:54
Цитата
Не, все верно. Увеличил число итераций на два нуля (в строковом представлении smile ) и разница возрасла так:

ИЕ - 450 на 3000мс
FF - 220 на 3300мс

Это ты сборщик мусора изнасиловал smile

Автор: Иль 31.5.2005, 17:55
Цитата(Sardar @ 31.5.2005, 17:47)
Если фанатично подойти к скорости, то не нужно создавать собственных обьектов

Да, верно, можно забыть, но нужно знать! Sardar, ты, наверно, уже знаешь мои пристрастия smile, без собственных объектов я никуда и никогда

Добавлено @ 17:58
Цитата(sergej @ 31.5.2005, 17:53)
Это ты сборщик мусора изнасиловал

Не, проверел на выносливость извращенным способом smile ...

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)