Dec 9 2009 - Bringing you a faster GeoNet website
The GeoNet website development team share some of the techniques they've recently used to decrease page response time during and after major earthquakes.
During heavy load, the GeoNet website hasn't been performing as well as we would like. By "heavy load" we really mean lots of people trying to view the same pages all at the same time, the effects of which are especially noticeable right after a large, widely-felt earthquake.
The GeoNet development team has stepped up to the challenge and recently implemented a number of improvements that will speed up the time it takes for GeoNet web pages to display in your web browser.
There are a good number of techniques, blogs and books devoted to advising web developers how best to analyse and optimise a website, and the development team have studied those best suited to GeoNet's unique site-visitor patterns.
In order to target areas most often visited after an earthquake, the team started by looking at web-server traffic for specific events such as the magnitude 7.8 Dusky Sound earthquake of July 2009. Armed with this information they then came up with a raft of individual solutions, some of which are detailed below.
Optimise all frequently requested files
Each "page" of the GeoNet website is probably made up of 10 or more individual files. Many of these files are images and some are made up of code that your web browser understands. The latter (Javascript and CSS) are used for things like page-layout and user-interaction.
Images are the sort of thing that are easily bloated in terms of their file size with no real visual gain, so by carefully re-looking at these, over 100 kilobytes (kb) of image-derived "weight" was removed from the home page alone. To put this into perspective: 100 kb is about the size of a 17 page Microsoft Word document. The gain is that now this equivalent "weight" need no longer be downloaded thousands of times a second after future earthquakes, meaning less strain on GeoNet's web-servers and New Zealand's internet. It will also result in faster loading web pages.
Part of that 100 kb saving was gained by using a technique called " minification". Minification programs remove unnecessary characters from JavaScript and CSS files which reduces their file size. Smaller, lighter files take less time for your web browser to download each time it requests a page which relies on them (nearly all of them).
Relocate "ShakeNZ"
After the latest earthquake RSS feed, the home page is the most visited page on the GeoNet website, so it made most sense to do as much as possible to speed up the delivery of this particular page. As you now know, less files and less "weight" equals faster pages and the interactive ShakeNZ application alone required 3 JavaScript and CSS files as well as a small collection of its own images. So having discovered that the interactive ShakeNZ wasn't actually heavily used, it was an "easy win" to simply move it to an internal page.
Optimise the number of requests for a file
When you request a page from the GeoNet website, this results in upwards of ten different files being requested from the server in order to build that page. The more requests that are made, the more work the web-servers have to do, and typically under high traffic scenarios they have to do it in less time in order to maintain your interest. By using some specific image-combination techniques, the number of individual requests for images needing to be made were dramatically reduced.
To illustrate this a little: before embarking upon the optimisation process, the familiar navigation icons from the tabs that run across the top of the site were all individual graphics. Each graphic was its own file, which your web browser typically asked for each time a new page was requested - 7 times all told*. You can see this for yourself if you follow the links below:
With a little tweak of the page layout, all these images were able to be combined into a single file, saving 6 file requests from ever having to be made. Follow the link below to see the new image:
* For the more tech-savvy of you, this of course depends upon your having an empty or a primed browser-cache.
Summary
There were a number of further techniques and tools used in the optimisation process that are beyond the scope of this article. As the number of people connected to the internet grows, we will continue to explore ways of reliably getting more information to you, and faster!
