Updated 2002-09-07
The demo site structure has been redone again. With wmoore.ca I have moved anything that is not for demonstration to the home page(http://wmoore.ca/). I went through the graphics again and reduced some more plus I merged 4 graphics into one for better downloads. Home page now less than 52kb.Updated 2002-08-17
Although it makes the FloatAway toolbar easier to steal I have merged the toolbar from 3 files into 1. Less calls to the server, faster for the client, better on the network, less files to maintain. The site now loads all graphics on the first visit and has several new site wide functions... The home page is still less than 60kb in total. I have seen lot's of sites with one graphic larger than that. Looking into various ways to consolidate graphics.Every day I hear people say the web is slow and to do anything requires large bandwidth. Most websites are now over 200k for a home page. That is crap. You can do lot's of stuff with very little bandwidth. This site is an example of what you can do with a home page that is less than 40k in size on your first visit. It will take less than 10 seconds to load on a 56kbs modem. Now that is fast. The home page loads many functions used on other pages so other pages load very fast as well. There is no single page that is over 40k so when a customer clicks a button they can expect response.
It takes less than 3 seconds to load the home page on my cable connection according to Netscape. It takes 2 seconds to load from my internal network without going through the net(not much difference).Optimizing this site for speed has obtained the following benefits:
- My server has a lighter load so it runs faster and can handle more users.
- I am less likely to incur extra bandwidth charges.
- Home page is very small so I don't congest the network.
- You don't have to wait for ever for the home page to load.
- You can do what you want fast.
- Subsequent pages are smaller which gives #1,2,3 and 4 benefits.
- Much better site organization which allows me to maintain it easier.
- Very little duplication so changes can be effected much easier.
- Side benefits of customization are easier to obtain.
Keys to making a site fast include:
- Architecture. Without this everything else falls apart.
- Utilizing client server concepts for web pages.
- Avoid repeating any code.
- Use Cascading Style Sheets(CSS).
- Avoid graphics where possible.
- Use "smart" pages.
- Clean your HTML of junk code.
- Reduce HTML code where possible.
- Re-optimize, re-optimize, re-optimize.
Obviously there is more required but that is what you want to hire me for. This is probably one of my strongest points. I make things go faster. Sometimes it requires a whole redesign but in the long term it is worth it.
This is a never ending battle that constantly needs revisiting but if you have a lot of traffic it is critical to contain costs. In addition you get lot's of other benefits...but isn't it all worth it if your customer is happy? The reason I spend so much time on this is because of my personal experiences surfing. I skip a lot of sites because they take too long to load. It gets worse on slower connections.
Even when we all have 10 times the speed of cable modems optimization will be critical. Actually it will be even more critical then...think of the load on your servers if everyone wants to download gigabytes instead of megabytes of data.On a side note....I did have a version of this site running that was less than 24k total but I wanted more global functions. I have seen sites take 40k+ for a logo alone. Then you have to add the rest of the site.
Can I optimize this site better? Of Course!... On the next version.