> > From: Michael Geary
> > Yeah, all that DOM creation will take a while - especially
> > if you use a convenience plugin like mine.
> >
> > I get much better performance across browsers with
> > [].join('') and innerHTML.
> From: Dave Methvin
> There don't seem to be that many situations where DOM
> creation is the performance bottleneck though. Probably the
> one one where I've seen a real difference is using ajax to
> fill a large table. Even in this case it turned out to be a
> $(".class") selector in a loop and not DOM creation. One
> trick I've used that speeds up DOM creation is to create an
> element and then use .cloneNode on it rather than create a
> new one each time.
Good point. The first thing to look for when optimizing jQuery code is $()
selectors being needlessly called in a loop. That is probably by far the
most common problem.
It was funny that in my whole discussion of building HTML strings and using
innerHTML, I mentioned "save a reference" and that turned out to be the
solution, completely unrelated to all the other stuff I was suggesting.
OTOH, in my own code, even after I optimized all the jQuery stuff, innerHTML
performed much better than DOM creation - it was several times faster for a
day picker widget with a lot of nested elements.
In my case, much of the overhead was actually my DOM creation plugin. When I
first experimented with innerHTML, I changed the DOM creation plugin to
generate HTML instead of DOM elements, and it was hardly any faster! Then I
went to straight HTML text with [].join('') and it was several times faster.
> Most of the comparisons between innerHTML and DOM are
> inherently unfair because the innerHTML examples don't guard
> against malformed HTML strings.
> If a user enters a special character like a quote, the string
> doesn't parse properly. With innerHTML there's the risk of
> cross-site scripting attacks as well if input is being
> accepted from the user, the URL, or unfiltered database results.
Ah! Good reminder! I'd better check over my code with a fine-tooth comb! :-)
-Mike
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
