If you're doing this:
test('#content a.submit');
then you shouldn't compare it to this:
test('("#myDiv").find("span.myClass")');
that's "apples to oranges." instead, compare it to this:
test('("#content").find("a.submit")');
The reason the other browsers are so much faster than IE 6 and 7with
bare class names is that they have support
for .getElementsByClassName() and .querySelectorAll()
--Karl
____________
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jul 2, 2009, at 3:53 PM, olsch01 wrote:
Hi Karl,
thanks for your reply.
I used jQuery tester in FF2 + 3, IE6, 7 + 8, Opera 9.64 and I think
also in Safari 4 (on my Win XP machine). The results were are all
kinda similar. Using the class selector was always fastest.
I just ran the following test (choosing jQuery 1.3.2 again):
test('#content a.submit');
test('a.submit');
test('.submit');
test('("#myDiv").find("span.myClass")');
The results in FF3:
#content a.submit: 0.448s
a.submit: 0.344s
.submit: 0.331s
("#myDiv").find("span.myClass"): 0.399s
The results for IE are a bit strange and different from my earlier
results.
IE6:
#content a.submit: 1.641s
a.submit: 1.438s
.submit: 4.172s
("#myDiv").find("span.myClass"): 4.484s
IE7 (IE Tester tool):
#content a.submit: 2.046s
a.submit: 1.922s
.submit: 4.969s
("#myDiv").find("span.myClass"): 4.562s
IE8 (also IE Tester tool):
#content a.submit: 0.25s
a.submit: 0.219s
.submit: 0.219s
("#myDiv").find("span.myClass"): 3.578s
So only using the class name is much slower here.
Looking at my earlier test and this one, "a.submit" (i.e.
element.myClass) has shown the best overall performance .
Any comments? :)
Cheers
On 2 Jul., 19:36, Karl Swedberg <k...@englishrules.com> wrote:
On Jul 2, 2009, at 8:45 AM, north wrote:
Hi,
I just tested all my jQuery selectors using the jQuery Tester
(http://
jquery.nodnod.net), and the results seem to "contradict" one thing I
read in a performance article: that you should descend from the
closest parent ID when using classes in your selector (the article
says "April 09", so the latest jQuery version was already
available).
In my tests, using just the class selector (like span.myClass) was
always fastest (sometimes twice as fast as #myDiv span.myClass), and
this in all browsers I tested, not just the ones supporting
getElementsByClassName.
Maybe descending from the closest parent ID becomes a factor when
you
have a lot of elements on you page? Any experiences?
Thanks
If the selectors aren't causing a discernible bottleneck, I wouldn't
worry too much about optimizing them. Just out of curiosity, though,
what happens if you do this:
$('#myDiv').find('span.myClass');
any faster?
Also, which browser are you testing?
--Karl
