If the access log file size reaches to around 4GB on windows machine, apache will be very slow to respond and will hurt the web application performance badly. You should keep checking log file size regularly to make sure its within acceptable range. Access log file is normally found in logs/access.log under the apache installation.

Apache provides built in functionality to rotate these logs on daily basis so it does not grow much and create performance issues to server. If we set it up, new file will be created for each day. Following is method to setup log rotation on Windows with WAMP, Apache 2.2.11.

Log rotation can be done at two levels, one server level and second on virtual host level. To do a server level log rotation you will need to modify /conf/httpd.conf file under apache installation. To do a virtual host level rotation will need to modify file \conf\extra\httpd-vhosts.conf file.

For server level log rotation open file /conf/httpd.conf and find line like
CustomLog "C:/Program Files/wamp/logs/access.log" common
The line defines the log file. Now we will define log rotation in following manner
CustomLog "|bin/rotatelogs.exe C:/Program Files/wamp/logs/access_%y-%m-%d.log 86400" common
here |bin/rotatelogs.exe tells that logs should be sent to rotatelogs.exe program which is located under apache installation in bin folder (make sure the exe file exists and have permissions).

The C:/Program Files/wamp/logs/access_%y-%m-%d.log tells the location of new log files. Here %y is year, %m is month and %d is day so the file name remains unique. 86400 is time span defined in seconds after which new file is generated, in this case its 24 hours (24x60x60) means log should rotate daily.

Be sure that you user have permission to write a file on given location (C:\ in this case). Also be sure that there is no space in file path given as it will create issues in creating new file.

After making the changes save file and restart apache. Now check if new file is created properly on access any web pages on this server. The new file should be created with name like “access_10-08-18.log” assuming that today is (Aug, 18 2010).

If you have to do same thing for a particular virtual host than you should add following line in <VirtualHost xxxxxxxx> definition.CustomLog "|bin/rotatelogs.exe C:/Program Files/wamp/logs/access_%y-%m-%d.log 86400"

This should help improving performance of the web server as it has to write to a small file, secondly it is easy to download and analyze small logs as compared to huge files.

Browsers allow parallel connections to a single hostname. This allows files to download faster in parallel and very helpful for web application performance. When JavaScript file is called browsers halts the parallel connections to all hosts. This is because JavaScript can alter the document dom with document.write().

This can badly hurt the front end performance of a web application. To avoid this all calls to JavaScript files should be moved to bottom of the page, just before end to BODY tag.

If it is not possible to move JavaScript calls to bottom, one should use DEFER attribute when calling script. Example code for this is
<script src="script.js" type="text/javascript" defer="defer"></script>
Here defer tells that JavaScript does not contain any document.write() and browser should continue rendering. Problem with defer is that FireFox does not support it, Internet Explorer supports the defer but not to as desired. Still its batter to use it.

For faster page loadeds its recommended that JavaScript should be moved at bottom of the page, so parallel downloads are not blocked by JavaScript files.

This post is part of our “Web Application Performance“. You can find more exciting post to improve performance of a web application in Web Application Performance category.

A CSS file or style should be placed in HEAD element of the page. It is important because browsers render page progressively if CSS is placed in HEAD. Putting CSS at bottom can block progressive rendering in most of the browsers. If CSS is placed at bottom the browser have to redraw all elements, this hurts the front end performance for visitor and they have to see a blank page for a while.

HTML specification also suggests that CSS should only be placed in HEAD. It still can be added within BODY but best way is to place it in HEAD. Also it is good idea to use only one CSS in web application. You can combine multiple CSS to avoid more HTTP requests to web server.

This post is part to our “Web Application Performance” series. You can find how to combine multiple CSS into one file in our post “Reducing HTTP requests“. You can also fine more stuff to improve web application performance here.

For enhancing web application performance the rule is simple, reduce http requests. We will discuss methods to do it, in detail but first lets look why we should reduce http requests?

How reducing http requests can help in web application performance?

Web browsers only allow limited number of concurrent connections per domain, more requests means that requests have to be queued one after an other. Web page is not considered completed unless all objects are downloaded. Additionally each request have its own overhead of send information to server and wait for server response. Most of the times each request will also contain cookies, which is addition overhead. See the left image for a page having long waterfall of http requests for images etc.

Now compared to a page having less objects, you can see a small amount of http requests and faster page completion. Reducing http requests can significantly reduce the response time for user and will make web application faster.

How to reduce http requests

Normally there are 3 types of objects are used in a web page. These are image, css and JavaScript files. Different techniques can be used to reduce requests.

Combining Images

Best way to reduce requests for images is to use sprite image. Sprite image contains all images need in a single image. You will need some css skills to use sprite images to give look like a normal images. You can do further self study on sprite images and how to use it.

See an example sprite from Google home page, which contains all 45 icons combined in a single image. Imagine only one request has be made instead of making 45 request in queue mode.

Combining CSS files

If a page is having more than 1 css files, these files should be combined into 1 file. You can put code of one css into the other file to reduce extra request.
Imagine two files files 1.css and 2.css are called from page like
<link rel="stylesheet" href="style/1.css">" type="text/css" media="all" />
<link rel="stylesheet" href="style/2.css">" type="text/css" media="all" />
You can put code of 2.css at the end of 1.css and remove the call for 2.css from code.

Combining JS files

If a page is having more than 1 JavaScript files, these files should be combined into 1 file. You can put code of one JS into the other file to reduce extra request.
Imagine two files files one.js and two.js are called from page like
<script type="text/javascript" src="js/one.js"></script>
<script type="text/javascript" src="js/two.js"></script>
You can put code of two.js at the end of one.js and remove the call for two.js from code.

Using browser cache for performance

Another effective way to reduce http requests is to cache the static contents in browser. This gives advantage when visitor visits the page again. On next visit all images and files are loaded from local cache and no http requests are sent. This give very fast experience to user.
Ideally no images, css and js file request should be made when page is viewed 2nd time. See two graphs for first and 2nd view of page.

Repeat View Graph: The js and image request are for Google analytics only as these are not controllable by us, other than this only one request is sent for the whole page.

Please read our post Web Application Performance: HTTP Features for Performance to see how to cache images, css and js files.

• 304 Not Modified requests
• Expires header
• Keep-Alive
• Compression

304 Not Modified requests

When a page is opened, browser downloads all objects (images, css, js, flash etc etc) and put it in its cache (if not told specifically to not to). When caching it also stores the last modified data of the object. When same object is requested next time the browser checks if the object is already in cache. If found in cache browser sends a conditional http request to server, and sends the last modified date of the object in “if-modified-since”.

A sample request header will look like
GET /images/imagecache/109x100_carlisle-brass.jpg HTTP/1.1
Host: www.bestdoorhandles.co.uk
User-Agent: Mozilla/5.0 (Windows; ...
If-Modified-Since: Sun, 20 Jun 2010 04:57:52 GMT
The header is telling server that I have a copy of the image which was last modified on “Sun, 20 Jun 2010 04:57:52 GMT” tell me if the image was not modified after that or not?
A sample response header from server will be like
HTTP/1.1 304 Not Modified
Content-Type: image/jpeg
Last-Modified: Sun, 20 Jun 2010 04:57:52 GMT


The response will not include any image, so the size of response will be very small. After receiving this header the browser will use image from it local cache. This way a lot of user bandwidth is saved to give faster experience to visitor. When evaluating your web application performance make sure to test this behavior and make sure its working properly.

How to enable 304 Not Modified requests?

Apache web server sends the last modified date with each object by default, so you don’t need to do any thing to enable it.

Expires header

Expires header is great way to improve web application performance. 304 not modified requests make page load faster as compared to normal request, but they still send request to server and server has to validate it each time. This adds a round trip between client and the server.

Expires header is great because it tells browser to use object from cache without requesting the server again and again. Expires header consist of a date in GMT format. When browsers gets and expires header it stores the object in local cache with the expires date. The browser will not request the same object unless it is expired or refreshed (F5 or refresh button) by visitor.

An example header with expires will look like
HTTP/1.1 200 OK
Date: Sun, 20 Jun 2010 06:47:23 GMT
Cache-Control: max-age=3456000
Expires: Fri, 30 Jul 2010 06:47:23 GMT
Last-Modified: Mon, 23 Jun 2008 11:59:38 GMT
Accept-Ranges: bytes
Content-Length: 1388
Content-Type: image/jpeg

Now this images will be stored in local cache and browser will not send request for this image to server unless “Fri, 30 Jul 2010 06:47:23 GMT”. This is a great way to reduce http requests on repeat view of the page.

How to enable expires header?

For Apache web server you can add expires headers by adding following code in .htaccess file
<ifmodule mod_expires.c>
<filesmatch "\.(jpg|JPG|gif|GIF|png|css|ico)$">
ExpiresActive on
ExpiresDefault "access plus 7 day"
</filesmatch>
</ifmodule>

This tell apache web server to add expiry of 7 days to images, css and ico files, from time they are served.
When evaluating web application performance be sure that proper expiry headers are being sent from server.

Keep-Alive

Using persistent connections (keep-alive) is another great feature to be used for web application performance. HTTP is based on TCP, in early versions of HTTP a connection has to be opened for each request and closed later.

In later version this feature was introduces where browser and server use same connection to receive and send many requests on a single connection. This saves the overhead of opening and closing connections. On

Browser and server send a “connection” header to specify that they support keep-alive or persistent connections. Sample request and response headers can look like
Request header from browser
GET /images/imagecache/100x100_SW123.jpg HTTP/1.1
Host: youdomainname.com.ss
User-Agent: Mozilla/5.0 ( ...
Keep-Alive: 115
Connection: keep-alive

Response header for web server
HTTP/1.1 200 OK
Date: Sun, 20 Jun 2010 07:07:19 GMT
Last-Modified: Mon, 23 Jun 2008 11:59:38 GMT
Connection: keep-alive

How to enable Keep-alive?

Apache web server keep-alive is enabled by default. This configuration can be changed from apache configuration file.

Gzip Compression

Compression is a great feature to reduce the size of response from server, thus saving a lot of bandwidth of visitor. Gzip is used to compress response, it can reduce the size 70% or more, thus giving a faster response. Almost 90% of web traffic comes through browsers which support gzip compression, as all major browsers support gzip compression.

Browser tells the server if they are ready to accept gzip encoding, a sample request header will look like
GET / HTTP/1.1
Host: youdomainhost.co.cc
User-Agent: Mozilla/5.0 (...
Accept-Encoding: gzip,deflate


A sample response from server with gzip enabled will be like
HTTP/1.1 200 OK
Date: Sun, 20 Jun 2010 07:08:33 GMT
Content-Encoding: gzip
Vary: Accept-Encoding
Transfer-Encoding: chunked
Content-Type: text/html


How to enable gzip compression?

For apache web server gzip compression can be enabled by mod_deflate. If you have mod_deflate enabled on your web server you can enable gzip compression by adding following code in .htaccess
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript
</IfModule>
The code tells server to add gzip compression on webpages, text files, css and javascript files.

If you don’t have mod_deflate installed you can add compression by following php code

<?php
ob_start(‘ob_gzhandler’);
?>
<html>
<body>All of my page</body>
</html>
<?php
ob_end_flush();
?>

When considering options to enhance web application performance do consider gzip compression. You can also see Compress you pages to know more about gzip compression.

Over all these http features can be used to achieve great performance for you web site. This post is part of our “Web Application Performance” series, see the post for other great performance enhancements.

Optimizing website performance includes optimization of different aspects of a site, ranging from image optimization to advance level web server enhancements. The performance does not only include fetching HTML code from the server, it also includes download time of all images, css, js files and other objects in page.

According to a research only 10 to 20% of total time is spent fetching html and rest of the 80 to 90% is spent of other objects. Focusing on this 80 to 90% time can improve user experience of an web application. In this series of posts we will focus of methods to improve in this area.

The series will include following methods to improve web application performance

• Using HTTP features 304 not modified, expires header, keep-alive, gzip
• Reducing HTTP requests
• Caching images in browser
• Gzip Compression
• Proper CSS Placements
• Proper JavaScript placement
• Minimizing CSS and JavaScript code
• Serving images from cookie less domain
• Avoiding HTTP redirection
• Optimizing Ajax
• Use PHP accelerators

Stay tuned for updates in this series. We will be adding details for all these methods and few more ones.

As PHP pages are compiled than executed for each and every request, it consumes a significant amount of processor time for busy websites, thus creating a bottleneck. If processor is busy it will reduce server’s capacity to server more web requests per second.

Removing bottleneck
The solution to the issue is to use OPCode caching on web server. This saves the parsing, compilation time and a lot of I/O on each and every request.

There are a lot of accelerators available to fulfill need of performance hungry applications. Famous php accelerators include

• eAccelerator: Free, open source and great tool to improve performance. Covered in more depth in my post Installing eAccelerator
• Alternative PHP Cache: Open source, will become built in PHP 6
• ionCube PHP Accelerator: Born in 2001, only supports PHP 4
• Xcache: fast, stable and relatively new.
• Nusphere PhpExpress: Free, available for windows as well
• Zend Optimizer+: By Zend, part of Zend Server
• Windows Cache Extension for PHP: Free, open source by Microsoft for PHP under Windows

We will look into the above listed accelerators in depth, in series of post dedicated to each of them, starting with eAccelerator. Please see my post Using eAccelerator, the post includes details, performance impact and how to install.

Performance Impact on Web Server
eAccelerator can increase web application performance 1 – 10 times. It reduces the processor load and fasten the execution of php scripts.

Installing eAccelerator
First download and extract using following commands
wget http://bart.eaccelerator.net/source/0.9.5.2/eaccelerator-0.9.5.2.tar.bz2
Extract the tar file
tar xjf eaccelerator-0.9.5.2.tar.bz2
cd eaccelerator-0.9.5.2

Now we have to compile it
hpize ./configure –-prefix=/path/where/to/install
make
make install
now edit PHP Configuration (php.ini). Mostly found at /etc/php.ini
vi /etc/php.ini
Add following lines in php.ini
extension="eaccelerator.so"
eaccelerator.shm_size="0"
eaccelerator.cache_dir="/var/cache/eaccelerator"
eaccelerator.enable="1"
eaccelerator.optimizer="1"
eaccelerator.check_mtime="1"
eaccelerator.debug="0"
eaccelerator.filter=""
eaccelerator.shm_max="0"
eaccelerator.shm_ttl="0"
eaccelerator.shm_prune_period="0"
eaccelerator.shm_only="0"
eaccelerator.compress="1"
eaccelerator.compress_level="9"
Now create a temp directory which will used to store the compiled files and also set permissions to write.
mkdir -p /tmp/eaccelerator
chmod 0777 /tmp/eaccelerator

finally restart Apache.
/etc/init.d/httpd restart

Your site should be lighting fast, remember faster sites create happy customers. Please note that you need to change version, paths according to your server.

This post is part of our “Web Server Performance” series. In this post we have discussed using eAccelerator for web server performance. You can find details about more PHP accelerators in {post link}

Here, More exciting innovations found in 2.2 and perhaps peek at one or two of the more esoteric ones. These changes will surprise you.

SNI

SNI is the new feature in Apache 2.2.12, and you can now serve multiple SSL hosts off of one IP address. So there is issue with its documentation but it will resolve soon.

Till now the best documentation is available at http://wiki.apache.org/httpd/NameBasedSSLVHostsWithSNI.

Graceful Stop

There is an issue with old apache server, when stopped it will kill the all existing connection, but now there is an option for graceful restart. It is used to change the server setting without restarting the server. I will serve the current users, and new connections will come with new config

$  httpd -k graceful-restart

But the new option introduced graceful-stop this option will stop the apache server and complete current request in process. So it will stop the server when the request is complete.

$ httpd -k graceful-stop

This can reduce angry customers while settings are being changed on server

mod_substitute

Apache 2.2 introduced mod_substitute, which includes some of the functionality of both of the latter modules and allows you to modify the response that is being sent to the web client, using regular expressions. To use mod_substitute, you must know enough about regular expressions to express your desired change. For example, if you are proxying a back-end server images.local and want to replace that hostname in URLs with its external hostname, you would do the following:

AddOutputFilterByType SUBSTITUTE text/html

Substitute s/images.local/images.mysite.com/i

In this case, the i on the end indicates that the substitution should happen in a case-insensitive fashion. The AddOutputFilterByType directive specifies what kind of files the substitution should affect. You don’t want to do substitutions on images or PDF files, for example, as it will corrupt them and result in garbage.

It can also used in the .htaccess

mod_proxy_balancer

This is the new excellent feature. Before this, we had to use the hardware or software load balancer. Now apache 2.2 had introduced the functionality built in.

Its really a full-featured load balancing proxy for free, and included in your Apache 2.2 server.

To get started with mod_proxy_balancer, you can define your cluster pool like this:

<Proxy balancer://mycluster>
BalancerMember http://192.168.1.50:80
BalancerMember http://192.168.1.51:80
BalancerMember http://192.168.1.51:80
</Proxy>

Then, tell your server to proxy requests through to those servers:

ProxyPass /test balancer://mycluster/

This is the reference article to study about it more http://httpd.apache.org/docs/2.2/mod/mod_proxy_balancer.html

• WebPageTest.org: My personal favorite, and used by me. Gives multiple locations, waterfall view of requests and good optimization tips to improve web application performance.
• PingDom.com: Gives basic tests for free, I don’t like is personally because it can’t handle images which have space in its name, shows these as not found,
• BrowserMob.com: Provides testing from multiple locations in US and Europe, provides stats for load time, object type breakup etc.

My favorite is webpagetest because its give multiple location in US, China, Europe and tests provides detailed analysis. I includes waterfall requests view, connection view, CPU usage and rendering time etc. Also equipped with forum where you can discuss test results and tips to improve and discuss web application performance.