How to find slow-down in Javascript in IE6

Question

Something's slowing down my Javascript code in IE6 to where there's a noticeable lag on hover. It's fine in FF, so using firebug isn't that helpful. What tools are out there to help debug this in IE?

Answer 1

Microsoft Script Debugger, also see IEBlog for tips

Answer 2

Actually, the tutorial mentioned by Bill the Lizard suggests Script Editor, not Script Debugger. I have it, but for some reason IE's View > Script Debugger > Open menu choice does nothing. Maybe there's a conflict between Script Editor and Script Debugger somewhere or something.

Answer 3

Just a tip of what that "something" could be...

String concatenation in IE is (or at least was when I tested) very slow. Opera finished after 0.2s, Firefox after 4.1s and Internet Explorer 7 still hadn’t finished after 20 minutes!!!

Don't do:

for (var i=0, i < 200; i++) { s = s + "something";}

Instead, temporarily use an array, and then join it:

var s=[];
for (var i=0; i < 200; i++) s.push("something");
s=s.join("");

Answer 4

What I usually do is:

var startTime = new Date();
// Lots of heavy code here
console.log("Processing time: ", new Date() - startTime, " ms");

You can get Firebug lite to get console.log to work across browsers. This gives you an idea about how long any given section of your code takes to execute.

Once you know which is the erring section, you can explore options to fix it.

Answer 5

The lag could also be from a DOM update. When IE needs to re-render a page due to a DOM change, it can be noticeably slower than Firefox. Typically the cursor will freeze when this happens.

Answer 6

Is there a way using any of these tools to log every function call (including inline functions) that's being made, without putting in a console.log call everywhere?

Answer 7

Or, I can't find any profiling tools in script editor, so I can see what might be slowing things down on my rollovers.

Answer 8

Given speedy firefox and slow IE, xpath expressions and event handlers (make sure you're getting the right number of calls, not 10x the expected amount) are nice places to insert timers manually.

Answer 9

A little more info: I don't think there's actually any JS running on the objects that I'm mousing over. (At least none that I've put in.) Just css :hover stuff. Also, I've got both jquery and dojo running on the project, so who knows what they're doing in the background....

Answer 10

I think I've found the source of the slowdown for anyone who's curious: I'm using bgiframe to solve the IE6 select box z-index problem (discussed elsewhere on SO).