The real world costs of an heavy website
November 30th 2009
You often read about why you should keep your web pages as light as possible to be quick to load. While all of this is true, there’s also a very important reason why you should keep your web pages as light as possible and that’s regarding bandwidth costs.
We often take for granted unlimited bandwidth and that all of this is free, but it’s not and a change as small as an additional image in your page can have a big impact. at the end of your month.
It’s true that the bandwidth cost is quickly coming down, but when building websites for your clients (or yourself) you should always try to keep your pages as light as possible.
Disclaimer: I didn’t (obviously) take caching into consideration.
What about numbers
To demonstrate what I mean, I’ll use my current hosting as an example. I currently have 250 gigs of bandwidth a month and I get about 100k pageviews a month. With an average pagesize of 175k that mean I approximately use 16gig out of my 250 available. Nothing to be scared of, look like I won’t need to upgrade anytime soon. Also note that exclude all my projects download, which cost me another 15 gigs a month.
So as you can see, I could get a lot more views and my page could be a lot heavier and this wouldn’t be a problem. But still, add 75kb to my average page size and this suck around 7 gigs of bandwidth which at some point might save me from upgrading my servers.
It’ll take me a long time until I need to upgrade my hosting. I’d need around 1.5 million views to break the 250 gigs a month. But then again, my website is fairly small and if I ever reach that number I’ll be more than happy.
What about the big boys?
You know the kind of website where users click around like crazy, the kind of websites that get around 100k views a day (3millions/month) and when you start playing with those kind of numbers you really gotta start considering optimizing your page size not for the end user but for the person paying the bills.
As you can see a change as small as 25k can make a pretty big difference in the end. 70+ gigs is not a small number and that can mean a service upgrade if the bandwidth is not available.
What about Google?
Just for fun now! According to alexa.com, Google gets about 620 millions visits a day. That’s quite a lot of hits. I built the graph using their homepage size.
As you can see a tiny kilobyte can cost them 600 gigs of bandwidth, for a single day. I often hear people complaining about how their homepage is so plain. I think these numbers alone can explain why Google don’t use much images in their design.
Bottom line
When building a website, might it be for me, friends or clients, I always try to keep that in mind. Big players made some moves recently to cut down on bandwidth. You might remember MySpace disabling the auto play on their music player, not only did they save big on wasted bandwidth they also saved us from going crazy trying to find where that frigging music was coming from. Vimeo also did something similar by disabling the auto play on their video player.
Remember that you can nearly always save some kilobytes here and there and they are easier to find that you might think.
Nice.
Some say that you shouldn`t optimize unless situation force you to do so.
You not only earn Gb like you show on diagrams, you also gain knowledge which help you building another website or other software. I think optimization should be as important as testing. Unfortunately it isn`t.
btw. nice example with Google 🙂
btw2. which tool did you use for creating graphs?
regards,
Michal
Hi Michal, that’s exactly what I mean, if the 25-50kb I save when building the website can keep me from having to upgrade my service earlier, why not do it!
As for the graphics, I used Numbers which comes in iWork: http://www.apple.com/iwork/
Thanks!
Ah… Mac. Am I the only front-end dev who doesn`t use mac? 😉
@Michal: hehe it’s true that there are a lot of Mac users doing front-end, try it you’ll understand!
I’m a front -end and I do not use a mac 😛
@Cedric Dugas: Thank you! 🙂
If you want to look at cost of large pages, you can’t forget that the larger a page, the longer it takes to download. And longer a page takes to download and display, the less likely someone will be to purchase from a site. So even if you have bandwidth to burn, it’s best to be efficient.
wow great post.. learnt quite a lot.. .and here i was thinking making a slide show which will keep on loading pic from my server… oofffss
[…] Optimization – The real world costs of an heavy website […]
Great blog post. Bookmarked it already. take care.
What a great idea and explanation. I would have never thought to do this, but then again, that
Useful article. I can definately attest to the need to squeeze out things you really don’t need to include with your page. For example, I used to host the jQuery plugin on my site, but I switched to the google APIs for this, and immediately saw a speedup from my (fairly overloaded) static content server. Another thing to look at, especially if you use static servers, and you built them yourself, is to make sure that, say, lighttpd, is configure to properly send cache control and ETags headers for your static content files – I found the other day that .gif files weren’t being cached at *all*, and enabling this helped speed things up and prevent the images from being grabbed every time. In fact, caching can have a pretty big effect on your average page size especially ones with images.
(Just to give some figures, my website has used up 8,836GB so far this month, with 21 million pageviews, and peaks at around 74MBit/s.)
@Delphy: I’ll check my NGINX, I recently set it up to serve static files but it might not cache the content, never really verified. How do you check this?
Sorry, I have never touched nginx so I really have no idea how to implement it there. But to tell whether or not it currently does is quite easy: Use FireBug’s Net panel to see all of the requests used by a page. The reponse should usually be a 304 Not Modified for static content, but you can drill down into the individual image files to see the server response. If it has Cache-Control and/or ETags, then you’re usually good to go.
Sorry I couldn’t be of more assistance.
Caching and gzip are the most useful way to save bandwidth!
I’ve been reading a few posts and really and enjoy your writing. I’m just starting up my own blog and only hope that I can write as well and give the reader so much insight.
Very cool site, I really enjoy your stuff.
Nice post along with a great blog design, nice job. I found this article contained exactly the information I was looking for and I will definately be returning! Thanks for an interesting read.
Hello I am so happy I found your blog page, I
really found you by accident, while I was searching on Google for something
else, Regardless I am here now and would just like to say thank you for a
marvelous post and a all round thrilling blog (I also love the
theme/design), I don’t have time to look over it all
at the minute but I have book-marked it and also included your RSS feeds, so when I
have time I will be back to read much more, Please do keep
up the awesome job.
Hi all, You could have performed a great job. Let me definitely stumbleupon the item along with for me personally advocate for you to my pals. Almost certainly they’re going to be taken advantage of this site.
Fine page! Every single day I appear to be learning somewhat more about NodeJS. It really is definately the only language to master long term. I recently fulfilled the BackSpace.Academy Amazon web services Certified Developers route. They have opened up a totally new Arena of applications for me. Now I want to find the time to get coding!
I continually attempt to keep that in mind. Big players made some actions currently to cut down on bandwidth. You might bear in mind MySpace disabling the autoplay on their track participant, no longer only did they keep massive on wasted bandwidth in addition they saved us from going loopy trying to find where that frigging music became coming from. Vimeo additionally did something similar by using disabling the autoplay on their video participant best essay writers uk.
I used to host the jQuery plugin on my site, however I switched to the google APIs for this, and right away saw a speedup from my static content server. another factor to have a look at, particularly if you use static servers, and also you built them yourself, is to make certain that, say, light pad, is configure to correctly send cache manage and ETags headers in your static content material documents – i found the other day that essay writing service | essayChamp.co.uk .gif files weren’t being cached at *all*, and allowing this helped pace matters up and prevent the pictures from being grabbed each time. In fact, caching can have a quite massive effect in your common web page length specifically ones with photos.
good article
Thank you
If your site loads slowly then you will lose your business, so to expand your business consult digital marketing company in bangalore.
Wow, great article. Thanks for that! Keep up the great writing! nice
Thanks for this great article. It is very helpful for business people.
Oh, numbers are not the field I feel confident in. I am not into financial topics or anything related to the economy or anything like that. I am more in humanities. When I need help on a subject I am not an expert in I refer to https://ratewritingservices.com/review/essaysprofessors-com-review.html they always help.
very informative post. Thanks for sharing
I have long been interested in the question of what are examples of essay interpretation? But you do not know where and how best to ask the answer? The answer is in front of you! Just turn to the masters of this business, who will help not only with the advice of a worthy professional, but also help in writing and thinking.