A typical web page will consist of dozens of files - images, javascript, CSS.

Web browsers usually load 2 files in parallel (recommended by the HTTP/1.1 spec to use max 2 keep-alive connections). If you are including many javascript files in your <head /> element, these will probably be loaded first, the images second. This is the effect of images appearing “late” over slow connections.

However, if your page can be displayed without the javascript (which is very recommendable because of accessibility issues), you might want the browser to load the images first. If your page totally relies on JavaScript - bad luck for you.

In order to improve your load times, you can use some simple techniques. For example by putting images on a separate server (e.g. images-amazon.com, yahoos yimg.com, static.flickr.com, photos1.blogger.com).

[Update: I’m not suggesting you (ab-)use one of these sites for hosting your images, but these are examples of big services using this technique. Blogger, btw, has a referrer filter, so it won’t work. And it breaks “planets”, so I actually recommend you to use a different blogging service.]

This is a common practise for large sites, for several reasons:

  • A web server serving exclusively static images can use a more lightweight, more performant web server software
  • It can benefit from different caching strategies
  • It can benefit from different hardware choice (e.g. slower CPU but more memory; raid not really needed, better to have two servers etc. pp.)
  • Images usually make up a large chunk of the traffic - but they’re easy to replicate to a worldwide mirror network
  • Authentication, cookies etc. don’t need to be sent
  • Might be outsourced, since it doesn’t contain business data
  • Images can be loaded via separate http connections

The last point is the inspiration for this posting - while your web server is still busy building some dynamic web page or serving some Ajax requests, your image server could already be sending out the images.

This might give the user the impression that your web site is much faster. Most users are broadband - but they still have some latency. In fact, latency has increased for many users with broadband due to interleaving on DSL lines, for example; ping is higher with regular DSL lines in germany than it was with modems or ISDN.

Some relevant pages: HTTP/1.1 Pipelining [w3.org], Mozilla pipelining FAQ [mozilla.org]