11 Tips to Reduce Server Load and Save Bandwidth

In a continuous growing environment, it is important that server plays it’s responsible role as required. However, there are some peak times when your server give-up or you cross your desired bandwidth limit. A server could be crashed by dozens of reasons, with each reason having several possibilities, with each possibility having dozens of solutions committing their existence. This could impose a huge amount of confusion for a small group of developers.

11 Tips to Reduce Server Load and Save Bandwidth

One thing we’ve noticed while managing few websites – in many cases they aren’t the fastest sites on the world-wide-web. While much of this may be due to the host server’s configuration, some of the performance issues are caused by things you can control.

In this article, we present Best Tips to Reduce Server Load and Save Bandwidth for your growing websites.

There are many reasons by which you can face website downtime. May be due to the host server’s condition (for example, if it’s a shared server, the other web sites running on the same server will definitely slow things down) or your website configuration or maybe due to your code. It’s essential to play safe.

There are few thing you need to keep in mind before exploring these tips that many times it’s possible that few of the mentioned tips not work for your one particular website that does not mean it’s not going to work with any another of your projects.

Also as a personal recommendation, If you’re looking for some mainstream tips for Reducing Server Load and Saving Bandwidth then try to make use these techniques as we also successfully able to get desired results in past.

You may be interested in the following related articles as well.

Feel free to join us and you are always welcome to share your thoughts that our readers may find helpful.

Don’t forget to subscribe to our RSS-feed and follow us on Twitter — for recent updates.

11 Tips to Reduce Server Load and Save Bandwidth

01. Use CSS Text Instead of Images

instantShift: Tips to Reduce Server Load and Save Bandwidth

Images make your Web pages slower and consumes a lot of bandwidth of your server. Instead of using a background image, use the CSS code. For example if you want to use plain red background in your website then use CSS code background-color:#F00 instead of a red-bg.jpg. With CSS, you can set the background color or background image of any CSS element.

These is a nice tutorial on CSS-Tricks.com about how wisely you can use your background images to reduce server load.

02. Optimizing Your Images

instantShift: Tips to Reduce Server Load and Save Bandwidth

More than half of the bandwidth on most websites is used by images and optimizing images is the best way to improve the bandwidth used on your web server. Optimize your images for the internet and shrink their sizes as well, never use bitmap files (.bmp) as they are HUGE (mostly in MBs). You should use jpeg (.jpg) or gif (.gif) files for images as these are optimized for the internet. A good rule of thumb is to strive for no one image being larger than 10 Kb. This is especially hard with animations, but if you can do it, you’ll notice remarkable difference in bandwidth used of your server. There are various image conversion programs/softwares available all over the internet and there are various optimization programs too, be sure to get an optimization program that will be able to retain the images quality while drastically reducing its size.

If you’re using Photoshop, use can compress your images by ‘Save for Web & Devices’ (Alt+Shift+Ctrl+S) option to optimize it for minimum bandwidth. When you have an image with lots of colours, you should go for JPEG or PNG. Play around with the quality to change the file size.

Check out the Seventh Georgia Tech GVU WWW survey as quoted in “How Much is Too Much”.

03. Compress your CSS by shorthand CSS properties

instantShift: Tips to Reduce Server Load and Save Bandwidth

CSS files can be pretty big, with lots of useless breaks and spaces. CSS shorthand properties are great! They’re a great way to reduce the amount of code contained in a CSS document, allowing for faster download times and easier editing. For example you can use

margin: 2px 1px 3px 4px (top, right, bottom, left)

…instead of

margin-top: 2px;
margin-right: 1px;
margin-bottom: 3px;
margin-left: 4px

There is a cool article written by webcredible.co.uk about CSS shorthand properties.

You can also use the CSS Compressor from arantius.com to reduce the size of CSS file and unnecessary breaks and spaces.

04. Remove Unnecessary HTML Code, Tags and White Spaces

instantShift: Tips to Reduce Server Load and Save Bandwidth

You can compresses your page size by removing unnecessary white space in your HTML files even remove comments (if not absolutely necessary) because every extra charecter means extra page size. Whether you use visual HTML editors or notepad, your HTML code contains unnecessary stuff: unneeded spaces, returns, meta tags, default values in HTML elements, etc. They will make your web pages bigger, without serving any real purpose. Bigger web pages takes longer to load, increases data traffic of your web server, and waste precious bandwidth.

Wordoff is simple and useful web tool that lets you remove unnecessary tags and styles from HTML code. Most of us have to clean up the HTML code manually in our working life. This web tool definitely help all of us in that situation and you also find this worth bookmarking.

05. Use AJAX and JavaScript Libraries

instantShift: Tips to Reduce Server Load and Save Bandwidth

AJAX is a technology for a web page to communicate with a server using JavaScript without reloading the page. In general, related pages on a website consist of much content that is common between them. Using traditional methods, that content would have to be reloaded on every request. However, using Ajax, a web application can request only the content that needs to be updated, thus drastically reducing bandwidth usage and load time.

If you want to read further about techniques that you can use to save your bandwidth by take advantage of Google’s AJAX Libraries API, perishablepress.com published a article on this topic.

06. Disable File Hotlinks

instantShift: Tips to Reduce Server Load and Save Bandwidth

Hot Linking term is linking images or downloads from your website to other website(s). Basically the images are on your website and other websites just links image tags to your website, hence stealing your bandwidth. If people are ‘hotlinking’ to your image files, they are using your bandwidth which you will ultimately pay for.

You can stop this from happening by placing a ‘.htaccess’ file in the folder where your images are stored. This will only allow requests from your own pages to display the images – anyone linking to them from outside of your website, or any website you choose, will have the ‘red x’ instead of the image.

RewriteEngine On
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(.*\.)?yourserver.com [NC]
RewriteRule \.(jpeg|jpg|gif|png)$ - [F]

altlab.com wrote a nice tutorial to prevent hotlinking using the .htaccess file.

You can also use .htaccess generator to disable hotlinking provided by HTMLBasix.

07. Compress your HTML and PHP with GZip

instantShift: Tips to Reduce Server Load and Save Bandwidth

Just like the CSS, your HTML can contain a lot of whitespaces and useless breaks. If you are using PHP then you can use mod_gzip for Apache to compress your content. Mod_gzip is a module for apache (existing on both windows and Unix/Linux versions of apache) that can significantly lower the size of a webpage on the fly, when it is requested by a browser that can understand compressed content (almost all modern browsers do support compression). Remember, the great thing is that the compression on the server is activated only if the browsers requests compressed content, in case the browser does not understand compressed content or does not request for it, the server simply servers plain, uncompressed content!

The easiest is way is by using a .htaccess file. I would recommend using .htaccess method because it’s very simple to implement and by .htaccess file you can further configure server configurations. Now to enable gzip compression add the following line to your .htaccess file.

php_value output_handler ob_gzhandler

Or in you can insert order for the PHP compression to work, you should insert the following line on the header of your webpages, on the top that is of your page:

< ? ob_start("ob_gzhandler");?>

webcodingtech.com wrote a tutorial about how to enable gzip compression.

08. Use free images/file webhosting website to host your files

instantShift: Tips to Reduce Server Load and Save Bandwidth

If you want to share (big) files and not let your bandwidth effect by it, host the file on free or paid image/file hosting websites such as Flickr, Pikasa, PhotoBucket, ImageShack, rapidshare.com and megaupload.com. Host the file and place the download link on your own blog or website. This will save a tremendous amount of bandwidth on your server. Before doing this, however, make sure you are permitted by your service provider to do that.

09. Avoiding Attachments Whenever Possible

instantShift: Tips to Reduce Server Load and Save Bandwidth

If the file you’re about to host on your server can be found elsewhere on the net, it maybe better to use the link of that location rather than hosting a copy of the file itself on your server. It will without any doubt cost you extra bandwidth but also increate server load. If nothing else, this will save you some time because you don’t need to upload file on your system.

10. Website Caching

instantShift: Tips to Reduce Server Load and Save Bandwidth

Caching is a method of retrieving data from a ready storage (cache) instead of using resources to generate it every time the same information is needed. Enable caching on your website if it’s not dynamic, will allow the end users computer to read from your server once in a while, the rest of the times it will read from its own backup copies until they expire. Another good idea is to cache your website but you might want to set an expiry date in the HTTP headers so expire headers tell the browser how long it should keep the content in cache. Most of the images on your site never change and it is good idea to keep them cached locally.

Caching with mod_headers

# 1 YEAR
<filesmatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$"="">
Header set Cache-Control "max-age=29030400, public"
</filesmatch>

# 1 WEEK
<filesmatch "\.(jpg|jpeg|png|gif|swf)$"="">
Header set Cache-Control "max-age=604800, public"
</filesmatch>

# 3 HOUR
<filesmatch "\.(txt|xml|js|css)$"="">
Header set Cache-Control "max-age=10800"
</filesmatch>

# NEVER CACHE
<filesmatch "\.(html|htm|php|cgi|pl)$"="">
Header set Cache-Control "max-age=0, private, no-store, no-cache, must-revalidate"
</filesmatch>

Caching with mod_expires

ExpiresActive On
ExpiresDefault A0

# 1 YEAR
<filesmatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$"="">
ExpiresDefault A9030400
</filesmatch>

# 1 WEEK
<filesmatch "\.(jpg|jpeg|png|gif|swf)$"="">
ExpiresDefault A604800
</filesmatch>

# 3 HOUR
<filesmatch "\.(txt|xml|js|css)$"="">
ExpiresDefault A10800"
</filesmatch>

11. Cache RSS Feeds

instantShift: Tips to Reduce Server Load and Save Bandwidth

RSS or Really Simple Syndication, as it is commonly known, is a technology that gives webmasters the ability to easily distribute and publish syndicated content on the Internet. Once the feed is cached it will be read from the local hard drive for a specified amount of time. After the specified time has lapsed, the RSS feed will be fetched again. This allows the contents of the RSS feed being displayed to remain current, while expediting the whole process. Cache RSS feeds reduce bandwidth usage. The bandwidth is reduced because the web server does not have to repeatedly fetch the same RSS feed from your server.

Conclusion

If you want to make a high traffic website, blog or image gallery, then don’t just relay on your webhost but spend a little more time to optimize your website and server. Because if you don’t then you will be looking for a new and larger webhost for your website soon enough. Although it’s always recommended to use a good and fast host but applying these techniques will save you a lot of server load and bandwidth in no time.

We Missed Something?

Do you have any more bandwidth saving techniques that aren’t on this list? Feel free to share them with our readers.

Like it? Share it.

61 Comments

  1. wow!
    Thank’s! Very usual!

  2. Nice post, Thank you

  3. Make fewer http requests
    Combine/minify JavaScript and CSS
    Use CSS Sprites

  4. Exactly. But the best techniques worked with us and saved lots of our bandwidth (~23 GB/day) are

    #6, #7, #8, #9 and #10 (specially #6 and #10). There were many websites hotlinking us previously so disabling hotlinks was major step and we optimized our server requests with #10.

    These are not just random points we collected from internet but we tried all of them on our website. After applying these techniques our website is alot faster and our CPU uses reduced by 30%.

    We will share more techniques in future if we find any useful.

  5. Useful information. I am going to try some of this tips. Reducing the load time is really helps. Thanks

  6. I am sure these will help you and your website. Apart from that, it’s interesting learning.

    I enjoyed alot reading optimization techniques.

  7. Very helpful tips. Must try the Gzip.

  8. Optimize your SQL. If you are using T-SQL (MS-SQL) avoid trims and other string manipulation. These functions throw your indexing right out the door since the SQL parser can’t predict what is going to happen.

    Also, index your tables properly. This will speed up server times drastically if you do a lot of data pulling.

    If possible reduce the number of elements on a page. This will speed up DOM manipulation and page rendering. To do this avoid using tables for page structure, use CSS to reduce elements and so on.

    One other thing, if you use MooTools, jQuery or another JavaScript framework, try not to add separate events to many different elements. If you have a set of similar anchors with ‘click’ events then set the ‘click’ event of each to use a shared function. Within this function do a switch based on either the anchor ID, rel, or other attribute. By using one function instead of multiple you will write slightly less JavaScript, but will also require less caching of your code.

  9. thanks for your post, it will help my upcoming Website project! :)

  10. thanks for the post!
    it will help for my upcoming web projects! :)

  11. To speed up Apache, avoid using .htaccess files and instead put the htaccess stuff into your host file. Every request Apache has to find, read and process the htaccess file, putting the htaccess stuff into your host file will have apache loading it only once.

    Since disk I/O is the slowest component of your server response time, adding an additional disk I/O to read the .htaccess file makes every access slower. For example, say you have placed an .htaccess file in the document root (/var/data/web/site/htdocs) and you are accessing an image file in http://server/dir1/dir2/dir3/myphoto.png. Here is what Apache checks:

    Does /var/data/web/site/htdocs/.htaccess exists?
    Does /var/data/web/site/htdocs/dir1/.htaccess exists?
    Does /var/data/web/site/htdocs/dir1/dir2/.htaccess exists?
    Does /var/data/web/site/htdocs/dir1/dir2/dir3/.htaccess exists?

    End result, extra server processing and waiting time.

  12. If you goto my site you will in all-likelihood gather enough fodder to flame me a good one. That being said you left out the best OSS web cache ever: Squid. The Squid proxy daemon runs in two modes: cache and accelerator. I have only used the cache and I still see a speed up. Apache is great and can be used as a proxy but I found configuring and updating Squid is easier. And, there is a very nice remote Linux admin tool that has a module that will allow remote admin of Squid including the filtering all requests and replies. Very good use against trojans and viruses with the use of add-ons.

  13. Nice post, just learned few things. Thanks

  14. In number 07 you write: “Or in you can insert order for the PHP compression to work…”

    Huh? I’m not sure I know what you are trying to say in this phrase.

  15. be entertained

  16. Nice tips see also imponderabilia.nl/cache/caching.php

  17. great post guys but i don’t know how to make the #10 of your list, do i have to make a php or css file with that code, or I just include it in some of my files, css? index.php? header.php?

    Great post I’ll use some of those tips on my blog

  18. Luis,

    You will need to add that in .htaccess file in you website root folder.
    Most of these tips are related to .htaccess file.

    More info about .htaccess files here.
    http://en.wikipedia.org/wiki/Htaccess

  19. Thanks for the useful tips! Some of these were actually new to me.

  20. good tips,it’s very useful

  21. Nice one …. i am going to use this on my upcoming projects….

    Thanks,
    Suresh.k

  22. dowload

  23. thanksss
    very good

  24. Nice post. One question though…

    For Gzip if I add the code to htaccess I don’t still ALSO need to add the other code to the top of each page, right?

    Or in the case of the tutorial on webcodingtech.com you wouldn’t ALSO need to put the ‘print gzip’ function at the bottom of all pages, right?

  25. Thank you for sharing your collection with us.

  26. Thanks for these tips. I tried the .htaccess tip and I did a test by hotlinking an image from another blog and it didn’t work?

    I used the following in my image folder:

    1. RewriteEngine On
    2. RewriteCond %{HTTP_REFERER} !^$
    3. RewriteCond %{HTTP_REFERER} !^http(s)?://(.*\.)?jarretmorrow.com [NC]
    4. RewriteRule \.(jpeg|jpg|gif|png)$ – [F]

  27. My trouble is my computer is doing this to my browser. All my pictures are blurry. Except certain ones. lol do you guys know where i can do stop this…it’s only on the internet. thanks Rachel Humphre
    rjaffeux@hotmail.com

  28. Good to see that you people are ghaving fun out there.

  29. Worth the read, I was having server load issues a while back, so this should help me some what.

    Thanks :)
    ————————-
    Eazy DIY

  30. Thank for your good tips. Anyways, with my problems, these above tips are not effective. I use auto translation plugin for my wordpress blog.

  31. Very helpful, I liked and implemented most of the tips on my blog and increased the load time by 46%, thanks

  32. really thank you for writing this article…it definitly helped me a lot…keep it up dear..:)

  33. Amazing tips, however mostly directed at reducing bandwidth. I would also suggest using Cloudflare to save even more bandwidth

  34. Great … very useful tips… I really appreciate it… keep it up… And thanks for sharing it…

  35. Cool buddy I liked your article……………I will do that to optimizemy bandwidth…….

  36. Check the spelling of portolio an the advertisement. i think its portfolio.. small mistake .. but its easily noticalble.

  37. I learned the seriousness of Disk space and Bandwidth usage when I switched from shared Web hosting to VPS. The more my site consumes the more I need to pay….

    Inorder to reduce disk space I started uploading images to Photobucket. Another tip is try to optimize your WordPress blog atleast once in a month :)

  38. Very good article, especially the point about optimizing images. Some web masters do not pay attention to this feature and the useability of their sites suffers a lot.

  39. Thanks a lot for your post. My blog with over 1000 visits/day but it use 2GB bandwidth/day. I’m trying to reduce bandwidth!

  40. 12. Use Tabs Instead of Spaces

    Using spaces in place of tabs in your code increases file size. While many coders will argue their preference for one over the other (especially in programming), I would argue that using tabs in web files is more appropriate due to bandwidth and download times. You can usually set this option in your text editor.

    If you use remove all white space in your code (as suggested in #4), it shouldn’t make a difference whether you use tabs or spaces.

  41. Really? A good rule of thumb is to strive for no one image being larger than 10 KB? That’s EXTREMELY unrealistic. That’s about the size of a standard favicon icon. A fairly small, highly compressed JPEG image is around 20 – 45 KB.

  42. Great article and advice.

    A couple things I came across that could help also are..

    disabling cron-jobs and manually setting one up via your hosting company.
    use a CDN such as cloudflare.
    use P3 (Plugin Performance Profiler) to see which plugins are causing the most stress to the server.

Leave a Comment Yourself

Your email address will not be published. Required fields are marked *

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