Should I care about JavaScript engine speed when using jQuery?

Question

I'm writing jQuery for a page that is a complex mess of many DOM elements (I have no control over this). The primary target browser is IE7, and I have concerns about the speed of its JavaScript engine. Scripts I've already written are laggy and have been performance-tuned to the best of my ability.

I could write script that is simple to maintain and understand, for example using a single contains statement. Or I can help out the engine by narrowing down the DOM search through this messy HTML resulting in more complexity.

Should I care about the speed of the browser's JavaScript engine when writing jQuery scripts?

Answer 1

jQuery is written in JavaScript. So you should care about the speed of the JavaScript engine as it also affects the speed of your jQuery code.

There are plenty of tips and tricks about how to write more efficient jQuery code. The main principle is to understand how jQuery works, how the selectors are translated into queries that select the elements from the DOM and so on.

Answer 2

Yes, but you shouldn't obsess over it :)

Answer 3

I have not run into a single instance where the benefits of using JQuery or a plugin (cross-browser compatibility, hugely useful functionality) are outweighed by decreases in speed. And I work with pretty large web pages sometimes.

Anyway, the only way you are going to know is to try it. Write your code in the most sensible way possible at first. If it is too slow, then you can look to optimize it.

Optimizing DOM Traversal
http://www.learningjquery.com/2006/12/quick-tip-optimizing-dom-traversal

Answer 4

Contains might be relatively slow, as I don't believe the document model is indexed in any way by what text appears inside the elements.

However, I'm not sure it's wise to try to overengineer something and optimize for optimizings sake. Go for the simplest thing that works, test, and then optimize if you have a problem.

Answer 5

No, you shouldn't care about it, because it shouldn't affect how you write code.

That is to say, you should ALWAYS write efficient Javascript, both because it's just good practice, and because for most sites you have no idea what browser any particular user is running, so you may as well assume the worst.

Answer 6

Yes you should be concerned, but luckily, the jQuery Team is just as concerned:

Recent Changes to jQuery Internals (Check out last two slides)

Answer 7

Try to use native Javascript methods instead of jQuery methods whenever possible and you'll generally notice a substantial speed improvement, especially in IE. IE's JS rendering engine is SLLLOOOOWWW compared to other non-sucky browsers.

For example, I had an AJAX script that was running fine in FF/Safari but ran like frozen molasses in IE. Turns out the developer that wrote it made heavy use of jQuery's $.each() method to get data from a large JSON file. I rewrote the script to use standard JS for() loops instead, and running a few speed tests on it afterwards showed that using for() was over TWENTY times faster.

Answer 8

Don't over optimize, but optimize as much as you need to.

If it's slow, then you really have no choice but to go in there and help jquery out. But then if it's not, then why bother.