JQuery Does Not Like QuirksMode
I was helping a client out today with a JQuery issue. They were well into the development of an applications that heavily uses the JQuery UI dialog widget to show information. Like most web developers they were using Firefox/Firebug for day-to-day development (because trying to develop complicated apps with IE is painful). All of their dialog windows were working normally with an acceptable load time.
However, when they started testing in IE, the dialogs screens were painfully slow. Less than a second in Firefox was now 4+ seconds on IE. We stripped it down to just a simple dialog, do nothing but displaying a div with some text and still taking a long time. At this point I knew it was something inside JQuery that was causing it. I didn’t think it was a bug because I’ve used them plenty of times cross browser with not problems. The team further drilled into the jQuery code that was taking so long using a profiler. There was some code that looked like this (not all of it)
return this[0] == window ?
// Everyone else use document.documentElement or document.body depending on Quirks vs Standards mode
document.compatMode == “CSS1Compat” && document.documentElement[ “client” + name ] ||
document.body[ “client” + name ] :
document.CompatMode returns two values: “CSS1Compat” when in compatibility mode and “BackCompat” when in quirks mode.
So, jQuery does something different in quirksmode than compatibility mode. A quick check determined the page was being rendered in quirks mode, which forced jQuery to use some less than optimal approaches to modifying the dome elements. I always knew this was the case, but I didn’t expect it to be 4 seconds of difference!!
This can be avoided by specifying the DOCTYPE for your pages. Apparently the team did look into this, but they had a comment before the doctype declaration and it must be the first line or it will be ignored by the browser, guaranteeing quirks mode in IE.
I’m sure that jQuery makes this type of check all over the place, so if you are targeting Internet Explorer I would stay in compatibility mode.