An XMLHTTPRequest tip

Over on the Ajax Blog, Dion Almaer passed on an important tip from Brent Ashley and Tim Aiello for AJAX developers – to have your cross-browser AJAX work better with IE7, you really should be invoking the native XMLHttpRequest (the cross-browser one) first to see if it’s available before instantiating the ActiveX control, instead of the other way around.

In addition to the reasons that Brent and Tim discovered, I’ve seen a bunch of code that creates the XMLHttpRequest object, uses it for a request, and then throws it away.  Obviously, this is a lot less performant than keeping the object around for multiple requests.  The native object's lifetime can be as long as that of the page. So you can reuse it like this:

            var  o = new XMLHttpRequest()
            o.open(“GET”, “data1.xml”,  true);
            o.onreadystatechange = foo();
            o.send();
            …….
            o.open(“GET”, “data2.xml”,  true);
            o.onreadystatechange=bar();
            o.send();

Xmlhttp.open has a “reset” semantic so the second open() call on the same object will abort the previous connection, disconnect previous event handler, and reset the object.

There's also a handy tool by Julien Couvreur for debugging XHTMLHTTPRequest calls for IE, or you can use Fiddler.

-Chris

Edit: Changed XMLHttpRequestObject() to XMLHttpRequest() in code illustration.