Website Optimization Part I – Analyzation

Sep 13, 2008 by d0rr    No Comments    Posted under: Web Development

Web developers are everywhere nowadays. It is not hard to hear that your friend or a friend of your friend has got their own website or blog. People tend to catch up with the fast-pace growing Internet era. Web 2.0 is mentioned everywhere, and everyone is busy bringing their conventional business or stuffs online. Like this, this, or even this.

While everyone is a web developer, who actually care about the insight of the development itself? Aside from rushing and get a website up, who actually care about the content architecture planning, usability testing, and long-term site maintanence? 

Let’s get started. I used a free Web Page Analyzer to do generate a quick report on my site.

I was pretty surprised to notice that it actually took 160.14 seconds for a 56K (dialup) users to load that freaking almost 1MB frontpage! I suppose no one will really stay for that long (approx. 3 minutes) just to load a crappy blog site! :)

Let’s have a look on what’s taking up the bandwidth. I used Firefox’s View Dependencies plugin. Upon installation, you may simply right click on any webpage and have a look at all the dependencies for that page. Pretty cool, eh?

53KB of total stylesheets are reasonable.

391KB of total scripts, wtf!?

444KB of total images, omg!

And the rest are not worth mentioning. 

After having a quick glance through of my javascripts, I figured out that it is the NextGEN Gallery plugin that I installed. It comes with scriptaculous, lightbox, jquery and some other prototype javascripts. The solution is really to uninstall it, which I am still hesitated to do so.

We move on to images. Definitely this can be resolved easily by two methods: reduce number of images and implement image compresssions. I quickly reduced 5 posts per page to 3 posts per page, and recompress the photo images using Photoshop’s “Save for Web” feature. Now, it greatly reduces the site size and loading time!

That is approximately 40% of reduction on the size and page load time!

The effort taken was just merely less than 10 minutes, which is probably something faster to be done than writing this post :P

We shall look into other website optimization soon on:

  • PNG vs JPEG
  • Efficient and Effective Layout
  • Good and Bad WordPress Plugins
  • … you suggest!



Related Posts with Thumbnails

Got anything to say? Go ahead and leave a comment!

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>