As a test of what type of overhead Offspring might add to the a page’s load time, I tested the library against each of Alexa’s top 10 US sites in Firefox 2.x, Firefox 3 beta, IE 6, IE 7, Safari 3.x, and Opera 9.x. The tests were conducted on a 2.33 GHz Intel Core 2 Duo running OS X 10.5 and Windows XP, as needed.
The “Full” vs “Light” captions in the table refer to Offspring being run in “full” or “light” mode, respectively. Offspring’s “full” mode contains all of its usual features, while its “light” mode includes fewer features in exchange for potentially faster run-times on some sites.
To help avoid spurious results, I timed each site five times in each browser; the times below are the the median values.
| Site | Firefox 2.x (Full) | Firefox 2.x (Light) | Firefox 3b (Full) | Firefox 3b (Light) | IE 6 (Full) | IE 6 (Light) | IE 7 (Full) | IE 7 (Light) | Safari 3.x (Full) | Safari 3.x (Light) | Opera 9.x (Full) | Opera 9.x (Light) |
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 1. Google | 46 ms | 32 ms | 13 ms | 11 ms | 62 ms | 62 ms | 62 ms | 47 ms | 4 ms | 3 ms | 9 ms | 9 ms |
| 2. Yahoo | 360 ms | 328 ms | 140 ms | 130 ms | 532 ms | 422 ms | 343 ms | 234 ms | 48 ms | 42 ms | 231 ms | 227 ms |
| 3. MySpace | 78 ms | 62 ms | 56 ms | 46 ms | 188 ms | 110 ms | 187 ms | 109 ms | 14 ms | 10 ms | 37 ms | 32 ms |
| 4. YouTube | 390 ms | 312 ms | 182 ms | 150 ms | 672 ms | 500 ms | 468 ms | 328 ms | 35 ms | 26 ms | 95 ms | 90 ms |
| 5. Facebook | 46 ms | 32 ms | 13 ms | 11 ms | 62 ms | 62 ms | 62 ms | 47 ms | 4 ms | 3 ms | 9 ms | 9 ms |
| 6. Windows Live | 16 ms | 16 ms | 13 ms | 12 ms | 31 ms | 16 ms | 32 ms | 16 ms | 3 ms | 3 ms | 10 ms | 9 ms |
| 7. eBay | 172 ms | 140 ms | 90 ms | 71 ms | 547 ms | 406 ms | 469 ms | 328 ms | 27 ms | 18 ms | 67 ms | 56 ms |
| 8. Wikipedia | 63 ms | 47 ms | 50 ms | 40 ms | 218 ms | 125 ms | 297 ms | 203 ms | 12 ms | 8 ms | 44 ms | 34 ms |
| 9. MSN | 516 ms | 391 ms | 77 ms | 67 ms | 766 ms | 438 ms | 484 ms | 266 ms | 54 ms | 50 ms | 277 ms | 264 ms |
| 10. Amazon | 672 ms | 484 ms | 329 ms | 262 ms | 1594 ms | 1172 ms | 1250 ms | 891 ms | 63 ms | 49 ms | 706 ms | 552 ms |
I almost didn’t test Safari 3.x and Opera 9.x as I had a hunch they might just turn out the best times. Sure enough, they both did very well overall. One thing that I didn’t expect, though, was the significant improvements between Firefox 2.x and Firefox 3 beta. Overall, though, Safari consistently offered the fastest times, with Opera and Firefox 3 beta not far behind. Branching out from there, the remaining results didn’t offer many surprises — Firefox 2.x generally turned in fast (but not ultra-quick) times, while IE 6 and IE 7 trailed behind.
So, what conclusions could one draw from these numbers? Well, Offspring’s suitability toward a given site probably depends both on the complexity of a site’s design and that site’s intended (browser) audience. Offspring’s running-time scales with the number of elements in the DOM and that’s the type of “complexity” that I’m referring to. This would be why the numbers for Yahoo may not be as bad as you might otherwise expect — while the site’s design may be relatively intricate, its CSS-based layout has far fewer elements than if the site was to be coded with a table-based layout. If by chance your design is table-based and/or contains a bajillion elements (this means you, Amazon), you might want to give some thought to whether Offspring is the best choice for your site.
IE has a significant market share and so, for most sites, their performance would be worth keeping in mind. On the other hand, if you’re building a site for which the decision has been made to focus on supporting more standards-compliant browsers, Offspring’s time-based limitations all but disappear (and even more so if you’re running Offspring in “light” mode). On the most element-heavy site that was tested, Amazon, the slowest in-light-mode time came to 552 ms (by Opera). And depending on how much other JavaScript your site may be running on page-load, that type of performance may be fine for you.