Friday, February 26, 2010

Native Element#classList in FF 3.6 Against RightJS

As many of you probably aware, FF 3.6 has the HTML5 Element#classList feature implemented natively. And then @DouweM asked if we could add it to RightJS.

Well, I tried, but the thing is that those guys at Mozilla could do it better. They have the test, the picture and yet another 2x times performance improvement, awright.

But lets check it out by ourselves, shall we?

I've created this little script which has two implementations, one uses FF 3.6 native feature, another one uses the same pure JavaScript algorithm we use at RightJS to handle css-classes. And here's a screenshot of my test-run.



Seems like RightJS implementation murks a native feature again. It's more than three times faster on classes adding :)

So how did those guys at Mozilla get their results?

They simply used lousy RegExp based implementation of the feature in their test. Surely it was slower.

This is pretty much it. Hope they will fix it in the next releases of FF.

2 comments:

Unknown said...

I guess, the “lousy” implementation in Firefox at least conforms with the specs. According to the W3C spec, classes may not only be separated by spaces, but by any whitespace character. Check http://www.w3.org/TR/html4/struct/global.html#adef-class

Your “proper” implementation does not work with class attributes that contain class name separators different from 0x20. You are comparing apples to oranges. Write code conforming to the spec, and do the benchmark once again.

Nikolay V. Nemshilov said...

That is a good point