XML HTTP has gotten a lot of press lately, largely due to Google’s decision to use it for Google Suggest, among other things. Which in turn has generated a lot of attention and led to a quite rapid adoption.
Microsoft first introduced XML HTTP in Internet Explorer 5.0, and Mozilla has supported it for quite some time now.
Over at WebFX we’ve been using it since late 2001, when Erik unleashed the xTree extension xLoadTree that fetches the content of folders as they are expanded.
Never the less it’s exciting to see all new the functionality that’s made possible using it, not to mention how it can be applied to enhance the user experience by creating a more responsive, more interactive, interface.
More then anything XML HTTP has enabled developers to make background HTTP requests a lot easier, and a lot faster. It does, however, raise a whole lot of questions; How much faster? Is it always faster? How about caching?
I’ve been asking myself those questions for some time and finally decided that it should be fairly easy to determine with a few simple tests.
What to test?
The basic question I wanted to answer was ‘How fast is XML HTTP compared to regular requests?’. Before XML HTTP was introduced the most popular way to make a background http request was to use a hidden frame or a hidden iframe. So thats what I tested it against. To make it more interesting I also decided to do all tests both in Internet Explorer and in Mozilla Firefox to see how their implementations compared to each other.
I also wanted to test if XML HTTP requests where cached, and thus decided to run each test twice, once where I would repeatedly request the same file and one where I would request unique files. If the files where cached the first run would complete much faster (as only the first request would actually be processed) but if they where not both would take about the same amount of time.
To further see the effect of caching I decided to run all test three times, with different sized files, as caching is most beneficial for large files.
Running the test
I created a script that would request a file first using XML HTTP in asynchronous mode, then in synchronous mode and finally using a hidden Iframe. Each file would be requested ten times and the average value would be returned. The same test would then be executed again, but with ten unique files instead of ten identical ones, to measure the effect of browser caching.
All those test where executed with three different files, a small 1 kB file, a 10 kB one and a fairly large 100 kB file, and they where repeated five times, taking the average value from all runs.
The tables below show the number of milliseconds per request for the different request methods. Its the average value computed by dividing the total execution time by the number of requests.
This clearly demonstrates that XML HTTP is a lot faster than using a hidden iframe for small requests, most likely due to less overhead. As the filesize is increased the advantage obviously shrinks, as the majority of the time is spent transferring the data instead of handling the request.
Another thing that can be seen is that Mozilla does not cache the data received using XML HTTP, explaining why the classic iframe method is so much faster for large files in Mozilla.
Internet Explorer on the other hand caches data received using XML HTTP in synchronous mode, but not in asynchronous mode, which is some what surprising.
All tests performed over a 512 kb dsl line. The script used is available upon request.
Internet Explorer version 6.0 sp2 and Mozilla Firefox 1.0.2 where used for all tests, both under Windows XP.
The stylish graphs where created by Jakob at Neod, they look so much better than anything I would have been able to produce, thanks!