2006-04-05

Improving page load times

Freshblog wonders if and how you cut down on page load times where external script files are involved. Depending a bit on what those scripts do and how they do it, you can.

If you run multiple constant, feature frozen scripts (contrary to evolving, externally hosted script maintained by some third party, such as the Labelr code John just retired due to excessive lag), you may join them all into one single script, pasting them together into one file in the order you used to link them in your page, and link to that file instead. This does not count bits that you need to add to specific parts in your page template for them to do their job, for instance if they use document.write() to inject content where they are put. (Google AdSense does this, for instance.)

This cut and paste job can bring down tens of script fetches into a single http request, which, assuming you put the script on a fast and responsive server, does marvels for page load times by eliminating a dependency on a multitude of different web servers to all be as quick and responsive serving your page its script code.

On a related note, if you link to lots of images on various web servers (hotlinking icons from social networking sites, feed readers, trendy eye candy, translation flags and whatnot) from lots of random locations, the same problem applies. If your blog is hosted by Blogger, I would warmly recommend using their quite excellent image hosting facility, downloading all the imagery you use to your hard disk, uploading them once to the Blogger image servers, picking up the URLs they got and using those URLs for your own template. It's a bit laborsome, but your blog visitors will thank you.

Conversely, if your blog template includes very large amounts of of inlined CSS code, as Blogger templates often do (as Blogger to date has not provided the option of hosting external CSS files for you), you may actually gain load time by ripping out all that code and putting it in an external file that gets loaded once, and for later page loads is cached by the visitor's browser so each consecutive page load does not have to fetch the same CSS code over and over again.

There are several good page load measuring tools available on the web, some of which give you good statistics and overviews of what adds load time for your web pages:

  • Web Page Analyzer shows nice table views over component sizes and minimum load times for modem bound visitors (and people on slow network connections in general).

  • Loading time checker is another, which lists a summary time and shows your images (though not those linked from CSS, which Web Page Analyzer handles).

  • Stop watch measyures how long time it takes your own browser to load the page, given your present state of page content and/or component caching.

blog comments powered by Disqus