jQuery performance
- by jAndy
Hi Folks,
imagine you have to do DOM manipulation like a lot (in my case, it's kind of a dynamic list).
Look at this example:
var $buffer = $('<ul/>', {
'class': '.custom-example',
'css': {
'position': 'absolute',
'top': '500px'
}
});
$.each(pages[pindex], function(i, v){
$buffer.append(v);
});
$buffer.insertAfter($root);
"pages" is an array which holds LI elements as jQuery object.
"$root" is an UL element
What happens after this code is, both UL's are animated (scrolling) and finally, within the callback of animate this code is executed:
$root.detach();
$root = $buffer;
$root.css('top', '0px');
$buffer = null;
This works very well, the only thing I'm pi**ed off is the performance. I do cache
all DOM elements I'm laying a hand on.
Without looking too deep into jQuery's source code, is there a chance that my performance issues are located there?
Does jQuery use DocumentFragments to append things?
If you create a new DOM element with
var new = $('<div/>')
it is only stored in memory
at this point isnt it?
