Following the reduction in bandwidth utilisation gained for the viewer as detailed in the previous post, I’ve tried something similar for the Timeline front page. Quick load times here are essential as they affect the user’s first impression of the site.
Timeline centres on photographs. Creating a homepage which loads quickly and is visually appealing is difficult; there’s always a trade-off between appearance and load times. Fortunately, in this case, there was great room for improvement; the homepage code contained a couple of inefficiencies which were sending load time through the roof.
Firstly, the large preview images displayed on the homepage were called from the large (640×480) images; now the thumbnail (320×240) images are loaded instead. Secondly, the small images which sit underneath the main preview image now load from the new mini (160×120) files, as opposed to the 320×240 versions. Thirdly, the number of previews which are cycled on the homepage has been reduced from 10 to 6.
Through these changes the size of an average homepage has been reduced from an unacceptable 1,140k to a much more pleasant 416k. Optimising the page’s JavaScript should reduce this further. And in the future, each preview will load dynamically using AJAX techniques whilst the previous is displayed. This should make the Timeline homepage much faster and more reliable.