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.
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.
11 Tips to Reduce Server Load and Save Bandwidth
01. Use CSS Text Instead of Images
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
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
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
1 | margin: 2px 1px 3px 4px (top, right, bottom, left) |
…instead of
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
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
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
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.
2 | RewriteCond %{HTTP_REFERER} !^$ |
3 | RewriteCond %{HTTP_REFERER} !^http(s)?: |
4 | 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
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.
1 | 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:
1 | < ? 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
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
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
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
2 | <filesmatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$"=""> |
3 | Header set Cache-Control "max-age=29030400, public" |
7 | <filesmatch "\.(jpg|jpeg|png|gif|swf)$"=""> |
8 | Header set Cache-Control "max-age=604800, public" |
12 | <filesmatch "\.(txt|xml|js|css)$"=""> |
13 | Header set Cache-Control "max-age=10800" |
17 | <filesmatch "\.(html|htm|php|cgi|pl)$"=""> |
18 | Header set Cache-Control "max-age=0, private, no-store, no-cache, must-revalidate" |
Caching with mod_expires
5 | <filesmatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$"=""> |
10 | <filesmatch "\.(jpg|jpeg|png|gif|swf)$"=""> |
15 | <filesmatch "\.(txt|xml|js|css)$"=""> |
11. Cache RSS Feeds
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.
from http://www.instantshift.com/2009/03/10/11-tips-to-reduce-server-load-and-save-bandwidth/