1. Cache statics

Caching static content (pictures, css files, javascript files) on the client’s side (in browser) means that having received static file once browser saves it in cache and doesn’t make a request to the server next time the html-document is requested. File will be taken from cache. Both sides win: client sends less requests, web site is working faster and server processes less requests. For instance, ordinary WordPress post page has over a dozen links to the static files (css files, pictures, scripts). Time spent on downloading these files exceeds time spent on downloading the post itself. Once having caching enabled the static content will be downloaded only once. While moving to the next page the only thing that will be downloaded is page itself. All static files will be taken from cache. In order to make browser cache static content, http-response must contain specific headers: Expires and Cache-Control. Those headers are set by mod_expires and mod_headers modules. For enabling caching, create .htacces file with the following content inside the static folder:

ExpiresActive On
Header set Cache-Control public
ExpiresByType image/.+  "access 15 days"
ExpiresByType text/css  "access 5 days"
ExpiresByType application/x-javascript "access 5 days"
ExpiresByType application/javascript "access 5 days"

In case there’s no such directory for static content and files are spread across folders of web site, than if you create following .htacces in the root of the site it will cache all static content on the web site by file extension:

<Files ~ \.(gif|png|jpg|css|js)>
ExpiresActive On
Header set Cache-Control public
ExpiresByType image/.+  "access 15 days"
ExpiresByType text/css  "access 5 days"
ExpiresByType application/x-javascript "access 5 days"
ExpiresByType application/javascript "access 5 days"
</Files>

This configuration makes server send http-responses to clients with information that pictures are to be cached for 15 days and scripts and css-files for 5 days.

2. Compress responses on the run

In order to save some time on loading the content, you can compress it. All modern browsers are able to receive comressed gzip-traffic. Text files (html-files, css-files, scripts, json-data) can be easily compressed and allow you to save 20-90% of traffic. Same time, music and video files can hardly be compressed as they have already be sized with special codecs. Here’s an example of enabling gzip-compression. Add the following line in .htaccess in the root of web site:

SetEnvIf (mime text/.*) or (mime application/x-javascript) gzip=9

As you can see, this configuration is quite simple. It’s enough to have all text documents (html, css files) and javascript-files compressed before going to the client’s side. It is worth saying, that server compresses responses only for those browsers, that support compressing. Browser informs server about its features through the headers of html-request.

3. Cache dynamic responses at server side

Often large amount of requests, addressed to database server, hinder the web site performance. For example, blog’s main page shows recent entries, recent comments, navigation menu, category list and tags. Those are several complicated requests to database. In case that information does not change often or the relevance is not vital, html-responses need to be cached without hesitation. You can choose to cache the blog’s main page once in 5-10 minutes. But that would be enough to improve main page performance in browser. Practically, application developer must decide what pages need to be cached and for how long. Also he needs to bring into life caching mechanism “out of the box” . Unfortunatelly, that doesn’t happen most of the time. Likely, mod_cache in Helicon Ape will simply and easily allow you to enable caching at server side. mod_cache supports two types of cache: disk cache and memory cache. First type saves caches data on the drive, and the second one does on memory. Memory caching is more preferable. If your server doesn’t have enough RAM, use disk cache. For example, to cache site’s homepage, we need to add the following lines in .htaccess in the root:

Header set Cache-Control public,max-age=600
SetEnvIf request_uri ^/$ cache-enable=mem

This configuration enforces caching of site’s homepage request for 10 min (600sec). Response are cached in memory. Be careful! You need to enable caching carefully. For example, pages that need authentificaton mustn’t be cached as they contain private data and need to provide different information for different users. In any cases, caching must be taking application logic into account. We’ve reviewed three simple steps for increasing the speed of your web site. Besides tangible speed-boost, which you will notice at once, the acceleration must well enhance your rating in search engine results. You can see performance graph of www.helicontech.com made using Google Webmaster tools after a simple optimization. So equip your site with these tricks and enjoy dual benefit!

Step 1. MySQL

After MySQL installation run MySQL Command Line Client and execute the following command:

create database wordpress;

Step 2. PHP

Install PHP into C:\inetpub\php to inherit NTFS permissions of IIS directory. It is of importance that C:\inetpub\php\php.ini contained the following directives:

magic_quotes_runtime = Off
extension_dir = "C:\inetpub\php\ext\"
extension=php_mysql.dll

After ensuring the directives are in place you need to register PHP in IIS configuration. To accomplish this:

• open IIS Manager
• open Handler Mappings snap-in

  

• press ‘Add Module Mapping’ and fill the fields in the opened window in accordance with the next screenshot (all images are clickable)

  

Step 3. WordPress

Download the latest WordPress version

Unzip the package into C:\inetpub\wwwroot\wordpress

Rename wp-config-sample.php into wp-config.php.

Adjust MySQL connection:

Create a blog

Now in Administrative panel you can set SEO-friendly format for your links, e.g: /%post_id%/%postname%

Your links will now look like http://localhost/wordpress/2008/uncategorized/hello-world

instead of http://localhost/wordpress/?p=123. If you now attempt to access any of the pages on your blog,

you’ll get 404 Not Found error

And that is defenitely not the desired result!

Step 4. Helicon Ape

It’s time to fix the above inconveniences and accelerate WordPress.

We’ll use the following Helicon Ape modules:

4.1 mod_rewrite

It’ll assist us in handling SEO-friendly URLs.

Open Helicon Ape Manager and uncomment/add the following line in httpd.conf to enable mod_rewrite:

LoadModule rewrite_module  modules/mod_rewrite.so

Now in Helicon Ape Manager browse to WordPress folder and put the following code to .htaccess:

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule (.*) index.php?$1 [L,QSA]

This piece of code checks whether the requested resource is physically located on the disk and if it doesn’t, performs rewriting to index.php.

Save changes to .htaccess. Request any blog page once again… It works!

Yes, it does… but not the best way… So we are moving on! ‘Cause only the best is good enough:)

4.2 mod_expires: client/proxy content expiration

With this module we’ll adjust browser cache so that the browser doesn’t send excess requests to the server. Go back to httpd.conf in Helicon Ape Manager and uncomment/add the following line:

LoadModule expires_module  modules/mod_expires.so

Subsequent lines (being put to .htaccess) will tell browser cache that images, css and JavaScripts must not be requested from the server (but rather taken from cache) within 1 day after retrieving resource for the first time:

ExpiresActive On
ExpiresByType image/jpeg "access plus 1 days"
ExpiresByType image/gif "access plus 1 days"
ExpiresByType text/css   "access plus 1 days"
ExpiresByType application/x-javascript  "access plus 1 days"

Let’s check what’s changed. The first request grabs all page resources and for each image, css and JavaScript sets the header Cache-Control: max-age=86400

Upon consequent requests to that page the browser does not ask for images, css and JavaScripts from the server but takes them from the cache until max-age expires.

4.3 mod_gzip

Are you enjoying the process? Then let’s implement the next stage. To make things even better, let’s apply on-the-fly compression that will reduce traffic and speed up page load. In our irreplaceable Helicon Ape Manager please uncomment/add the following line inside httpd.conf:

LoadModule gzip_module  modules/mod_gzip.so

And put the following lines into .htaccess in WordPress folder:

mod_gzip_on yes
mod_gzip_item_include Mime ^text/.*

These directives instruct Helicon Ape to compress only those resources which type starts with “text/”, i.e. all text, .html and .css files. Usually images and video compression is useless.

Uncompressed page had Content-Length: 5152, the same page after compression became as small as Content-Length: 2168. So, we’ve managed to reduce the amount of info to be transferred almost twice.

4.4 mod_cache

We are coming to the final and in conclusion we’ll enable server-side caching. Instead of requesting the same page from the server again and again Helicon Ape saves the copy of server response and fires with it when corresponding page is needed.

Uncomment/add the following line in httpd.conf (using Helicon Ape Manager):

LoadModule cache_module  modules/mod_cache.so

We’ll only cache index.php page. It will be stored in cache for 30 seconds so that the site looked dynamic. There’s no need to cache static files (.html, .css, images, Flash, videos) because IIS processes them really fast.

Note! It is worth mentioning that cache distinguishes query string parameters, thus it will store different snapshots for different blog pages.

There are some shortcomings of this type of caching (semi-dynamic web application). E.g. if the user posts a comment on the blog, it will see the result (his post) immediately, but another user browsing this page will only see it in 30 seconds (after cache expires). This issue may be resolved by reducing the time snapshot lives in cache, but it should nevertheless be taken into account.

Put the following lines into .htaccess in WordPress folder:

<Files index.php>
ExpiresByType "text/html; charset=UTF-8" A30
CacheEnable mem 
CacheVaryByHeaders Original-Url 
</Files>

Let us compare the productivity with and without cache. On our testing virtual machine we’ve obtained the following values:

• without cache – 7.45 requests per second
• with cache – 711 requests per second!

4.5 mod_headers

The last drop we want to add to our WordPress-based dish will hide IIS from robots and scanners.

You need to uncomment/add the following line in httpd.conf:

LoadModule headers_module  modules/mod_headers.so

And put the only line into .htaccess:

Header set Server "Apache/2.2.9 (Unix)"

Now our IIS appears to the world like

Congratulations to everyone who came to finish! It’s all done now! Enjoy flawless and fast WordPress operation and stay with us!

Best regards,

Helicon Team.