Improving Web Server’s Performance - Reducing Server Requests
As everyone knows, a web server or application server works on the fundamental principle of Request-Response technology. You send a ‘Request’ and the Server sends a ‘Response’ back. In today’s world, a web server or any web-based server receives uncountable requests. The server, by technical limitations can effectively handle the requests upto certain level. Beyond that, it cannot maintain the efficiency and that is where latency occurs.
When latency/delay occurs, the time taken to respond will slow down, causing a bad experience. So how do you overcome this issue? There are some effective ways where you can host your application across a group of servers commonly known as Server Farms. Install a Load-Balancer device and it will take care of sending the requests to servers which are serving minium requests at that particular time. This is done purely at hardware level. And yes, as the demand grows, the Farm has to be increased in capacity and additional hardware should be installed. On the other side this will increase the cost of the infrastructure.
There are certain techniques using which you can manage the number of requests effectively. In a web application scenario, you can carefully code the client such that it sends out minimum number of requests to the server and gets the complete data. Consider a scenario where you host a web page that links to 4 external javascript libraries and some 20+ images. Your Apache or IIS server may take upto some 0.2 msec or less to serve the data to the browser. Now think of a web page that links to nearly 12 libraries and some 50+ images. It may take upto 0.3 or 0.4 (just a reference time and not actuals anyway) msecs. Now if the web page is accessed by hundreds of users, then the timescale would multiply several folds.. leading to a performance drop.
Solution:
The solution is, reduce the server requests from the client side. Merge all your javascript files into one single file. Merge all your style sheets into one single file. Merge all your images into one single image. Did I say merge image? Yep! Merge all images. Means, pack all your images in a single JPG or GIF file. The technique is now very popular with online applications and many CSS and web architects suggests this technique to be followed. With the support for CSS standards in major browsers and broadband penetrating visible geography, it is quite easy to incorporate the above technique.
Open Photoshop, and open all your images. Now create a new large, vertically long empty image. Move all your images into this empty image and position them one-below-another. Note down the width and height of each image and their starting XY coordinates. Then change the code in your client pages (HTML / PHP or JSP or whatever). In the placce of IMG tag, replace IMG with DIV. Assign an ID for each such DIVs. In the stylesheet, specify the ID and declare the properties like height, width and use the background-image property to show the relevant image. This technique is used widely now and this dramatically reduces the server requests.
This technique, when applied over an existing template might require substantial amount of re-code. But anyway, at the end of the day, your web / app performance improves to a great extent!