Question

Are selectors or functions faster in jQuery? Example:

$('#something div.else'); // find multiple divs with class .else

or

$('#something').children('div.else');

I’m trying my best to optimize a page with hundreds of returned elements that seems to hang on a certain crappy computer here in the office (that must use Internet Explorer ::shudder::).

Answer 1

Well in this case, the second’s faster, but, they’re not equivalent. The first finds any descendant div.else, the other finds only direct children that are div.else.

It depends on your DOM as to which is faster, the equivalent of the second would be this:

$('#something > div.else');

This uses the child selector. They should be very, very close, and in any case, I doubt a selector descending from an ID is your problem area, I think you’ll find the vast majority of your time in JS is spent elsewhere.

For diagnosing speed issues, get a profiler, for IE specifically there’s a fantastic free one called dynaTrace AJAX Edition. Grab it, follow the short tutorials on their site…you’ll find where your pain areas in IE are pretty quickly.