Hi,
I'd like to present 3 ways of building ul list and compare the speed
of them.
I used firebug's profiler on FF3
html:
<body>
<a href="#" id="go">go</a>
<ul id="list"></ul>
</body>
$('go').observe('click',go);
First method:
Time to build (2122.406ms, 84055 wywołań)
function go(e){
e.stop();
$('list').update();
var tpl = new Template ('<li class="#{class}" id="#{id}">#{id}</
li>');
$R(1, 1000).each(function(i){
$('list').insert(tpl.evaluate({
class: 'klasa',
id: i
}));
})
}
Second:
Time to build (1754.548ms, 57053 wywołań)
function go(e){
e.stop();
$('list').update();
$R(1, 1000).each(function(i){
var li = new Element('li', {
class: 'klasa',
id: i
}).update(i);
$('list').insert(li);
})
}
Third:
Time to build (513.747ms, 30054 wywołań)
function go(e){
e.stop();
var tpl = new Template ('<li class="#{class}" id="#{id}">#{id}</
li>');
var list = new String;
$R(1, 1000).each(function(i){
list += tpl.evaluate({class: 'klasa', id: i});
})
$('list').update(list);
}
As you can see third method is 4 times faster than first one.
In first two methods around 50% of time took
extractScripts() & stripScripts() which are used in update and
insert
methods.
So if you have more complex RIA with many dynamic elements you can
simply improve it significantly :)
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---
