Website Performance: Delay Processing

When a page is requested from the server, process only what is necessary to generate the required output.

Any additional processing that might be necessary can be delayed or performed asynchronously.

Stuff like sending a an acknowledgement mail or logging are good candidates for delayed processing.

One tool which helps you achieve this is Gearman. Gearmand is a simple server which allows worker threads to register themselves for certain defined processes and clients can send processing requests to the Gearmand server. The Gearmand server queues up thsee requests and dispatches them to worker threads. Client and worker code can be in different languages. For delayed processing, use the asynchronous (do_background) call.

Website Performance: Use CDN Effectively

In most cases, we consider using a CDN (like Akamai) for static content like images stylesheets and JavaScript whereas ignore it for the HTML content.

Certain HTML might be cacheable. For example, if a certain HTML page changes every hour, for one hour it remains constant. It will be great if this page can be cached by the CDN somehow so that the first request from a region enables the CDN to cache it for the whole region.

The CDN is configurable for your site. Once you access the configuration, there should be options like:
1) Cache content on the edge server basis the cache headers sent by origin OR
2) Cache certain file/folder/url for X minutes/hours

It's imperative to understand and configure the CDN for optimal performance.

Website Performance: Memory as the primary storage

We normally use databases/filesystems as the primary source of storage and add caching (Memory/RAM) to improve performance of the application.

Consider the opposite approach. Use Memory as the primary storage and file-system as a recovery source. So, perform all read and write operations directly in memory but log inserts/updates in file-system. The writes to file-system can be asynchronous (delayed inserts) and thus never become a bottleneck.

This is a risky proposition and should be considered only if:
1) The database operations are becoming a bottleneck and you have tried all possible optimizations. Only the problematic data sets should be considered for this approach.
2) The data is non-critical i.e. it is acceptable even if the data is not available for certain time period. The time duration that this data will be unavailable will at least equal the recovery time from file-system.
3) Typical database constraints (unique, foreign key etc.) do not apply to the data.

Website Performance: Cache Database Query Results

Querying the database is an expensive operation and should be kept to a minimal.

Certain databases provide query caching capabilities. MySQL's query cache is great for tables which are used primarily for read operations Any insert/update query clears the complete query cache for the table. Thus, query caching cannot be leveraged for tables requiring regular insert/update operations.

Adding caching capabilities above the database layer can help boost performance. Before passing a read request to the database, an additional layer can check for appropriate content in the cache. If content is not available in the cache, request can be forwarded to the database and the cache populated before returning the result to application.

The caching layer can also trap any insert/update operation so that the cache is up-to-date.

If you are using Hibernate to persist your objects, the second level cache (and query cache) should be considered. They help achieve the same performance benefits using application level caching.

Website Performance: Cache HTML when possible

HTML content for a dynamic page is generated for each request made to the server. Though the page is dynamic (as it changes from time to time) there are 2 things which should be looked at:

1) What is the frequency of change. Does the content change with each request or does it remain constant for some duration (15,30 mins?).
2) If it remains constant for certain time-period, how much requests are made for the same content within that duration.

Using a combination of this, caching the content (on server side) might be feasible.

Example:
1) If the content is constant for 15 mins and only 2-3 requests are made for the same content within 15 mins, then caching is not of much benefit.
2) If content is constant for even 5 mins, and 10 requests will be made for the same content in that time, caching will certainly be beneficial.

Caching complete HTML can be expensive and if you do not have sufficient memory (RAM) to hold this data, it might be feasible to keep this data cached on the disk as well. If disk is chosen, then caching is beneficial only if the read operation from the disk is cheaper than actually generating the content dynamically :)

When caching HTML, an appropriate cache clearing mechanism will have to be built so that stale content is never shown.

Website Performance: Choose Appropriate Cache

Caching plays a key role in speeding up a web application. Before looking at what and when to cache, some consideration should be given to the appropriate cache which is suitable for your environment.

In case your application is deployed on a single server, then caching content on that server itself will suffice.

For distributed architecture (application deployed on multiple servers), distributed cache should be used.

Usually, the argument against a distributed cache is that it will involve accessing a remote machine which is expensive.

Let's look at how expensive this operation is.

Following are few interesting numbers picked from a presentation by Jedd Dean (from Google):

Time taken to read 1 MB sequentially from memory - 250,000 ns (thats nano seconds)
Time taken for round trip within the same data center - 500,000 ns

So, reading 1 MB from a remote server's memory should take roughly 750,000 ns (0.75 ms).

Considering that 1 second page load time is good enough, this is less than 1/1000th of the time. Thus, when we talk about web applications, reading from a remote server's memory will not degrade performance by any noticeable amount.

When using a distributed cache, it's advisable to use a bit more than what is required. This ensures that failure of a single server does not overload the application.

Example: If you need 4 GB of memory and you are using 4 servers (with 1 GB cache on each), add another (5th) server with 1 GB of memory for caching. This way, when 1 server goes down, the application performance will not get impacted much.

One of the most popular distributed cache implementation is Memcached. It's used by companies like Wikipedia, Flickr, YouTube and Twitter.

Website Performance: Don’t Let Third Parties Slow You Down

Recently a presentation was made by 2 Googlers (Arvind Jain and Michael Kleber) @ Velocity 2010 where they talked abnout how third party code can slow a website.

Third party code (like Google ads, Digg widget etc.) usually includes an external script. Since browsers block rendering while fetching JavaScript, this third party code also blocks rendering of your page.

Analyse your page with and without this third party component to understand the impact that it has on your site.

If you have an option to choose from multiple vendors, then choose the one which has least impact on your page.

Example: The new Google Analytics code loads JavaScript asynchronously to ensure minimal impact on page loading.

Website Performance: Separate Static from Dynamic

A dynamic page is one which can potentially change with each request to the server. But in most cases, there is also some content within these pages which does not change. This content remains static even when the dynamic elements change.

Such static content within a dynamic page varies from application to application but mostly it's stuff like the header, footer, drop-down values (like city, state and country) etc.

Analyse the dynamic page from this angle and come up with a list of static elements on it. If the static elements are considerable (like 30% of the content on a page) then consider separation. There are various techniques which can be used to cache the static elements on the browser.

This approach is useful only when rendering similar layout repeatedly. So, if the same static content (header footer etc.) will be shown for multiple page requests, then separation of static from dynamic is feasible. Whereas, if the static portion changes for each request, there is not much to gain by separation, rather you will end up slowing the existing pages.

Some of the techniques which can be used once the static and dynamic elements are separated:
1) Ajax: A popular and commonly used technique for search result pages. The ajax request is made and only the results are updated whereas the layout remains constant.
2) XSLT (XML+XSL): While requesting for a page, the static elements are embedded in the xsl file and the dynamic elements are fetched using a xml. The xsl can have cache headers defined so that the browser caches it. This is beneficial to the Ajax approach in cases where a new page request is to be made and the user leaves the current page to get content of a new dynamic page. Google for "Browser side XSLT" to get more details on this.
3) HTML in JavaScript as string: This is a simple approach to add html snippets within JavaScript as string so that they can be rendered (inner html) wherever necessary. Not a particularly good design as you will need to add html (view) within the code (javascript).

Website Performance: Utilize Browser's Idle Time

Once the page loads completely, the user spends few seconds on the page before moving to the next one. The browser is idle during this time and can be used to speed performance of subsequent pages on the website.

For example, in case of search results, it's highly likely that the user will move the the next page once he completes viewing results on the current page. Thus, developers can use intelligent javascript to pre-fetch content of the next page when the browser is idle. This will help the next page load much faster.

Another condition for pre-fetching could be before launching a new version of the site.

New version of a website usually has new static content (javascript, style sheets and images). When a regular user of the site opens this new version for the first time, he will find the site extremely slow. Thus, initially many customers complain about performance.

If we start fetching the static content in the background couple of days before the launch of the new version, customers will not face the slowness and find the performance to be much better. Of course, care has to taken so that there is no clash in names of classes (CSS) and functions (JS).

Website Performance: Hosted JavaScript Libraries

Most web applications these days make use of Libraries like jQuery.

These libraries offer significant advantages, but increase the initial page load time to a certain extent.

Most popular libraries are widely hosted by companies like Google and Microsoft. Instead of hosting these libraries yourself, it is feasible to include these libraries from such common locations.

When using the common location, chances are that the Browser has already cached the same URL and need not re-fetch the library for your site.

All in all, it's a win-win situation for you:
1) Saves bandwidth as you need not refer to your hosted library. In some cases this may save you some money.
2) Page loads faster as browsers might already have the libraries cached.

Google Libraries API provides a wrapper around the well known and widely used libraries (jQuery, Dojo, prototype, YUI etc.). Once included, you can directly load any popular library with a simple function call (example: google.load("jquery", "1.4.2"))

Setting up Go/Cruise 2 with github

I recently installed Cruise(now known as Go) Server to setup Continuation Integration for a project.

I ran into some minor problems while configuring git as the VCS. Following are few tips to ensure that you don't face the same issues:

1) Assuming that Git is installed under the default folder (C:\Program Files\Git), add C:\Program Files\Git\bin to System PATH (C:\Program Files\Git\cmd was already added but bin was not).
2) Restart Cruise Server
3) Use Git Read-Only URL (git://github.com/bagheera/getin.git). Initially I tried with SSH (git@github.com:bagheera/getin.git) which failed.

ext4 with Ubuntu 9.10

I was using Ubuntu 8.10 with ext3 as the file system type. The system performance was somewhat not up to the mark so I decided to install Ubuntu 9.10 with ext4 as the fs type. The overall system performance improved significantly after the installation.

For example: The HUGE folders in thunderbird are now opening much faster than with Ubunti 8.10 + ext3.

Till now i'm impressed with ext4 :)

Syncing Thunderbird 2.0 mailbox with Blackberry for an Exchange account

My organization uses Microsoft Exchange as the Mail Server and a BES server to sync mails on my blackberry.

The mailbox on server is allowed only 50 MB of space and thus I need to continuously delete mails on the server. Previously I used POP to fetch mails from Exchange to Thunderbird mail client but this had sync issues (mails were downloaded multiple times, the read/unread information was different on mobile and desktop) once I configured my Blackberry using BES.

I recently shifted from POP to IMAP (had to get IMAP enabled from the administrator) and this has solved a number of problems.

I've created filters which automatically shift few mails to the local folders and I manually move emails to local folders whenever required. The move operation does not automatically compact (delete emails on mailbox which were moved/deleted locally) folders but the following will make that happen:

Goto Edit -> Preferences -> Advanced -> General -> Config Editor and then make the mail.imap.expunge_after_delete option as 'true'. Restart Thunderbird to use this config.

Secondly, I wanted the sent mails to be saved on the 'Sent Items' folder on the Exchange Server's mailbox. This can be achieved by subscribing to the 'Sent Items' folder and placing a copy of send messages in the 'Sent Items' folder. To achieve this:

1) Right click on the 'Inbox' for the IMAP account and click 'Subscribe'. Select the 'Sent Items' folder. You should now see the folder next to Inbox on the left panel.

2) Goto Edit -> Account Settings -> Copies & Folders and select 'Sent Items' as the Other folder under 'when sending messages, automatically' -> 'Place a copy in'.

Setting up your mail using BIS (Blackberry Internet Service)

Once you've opted for blackberry services, the provider will setup an account on blackberry.com for you. For example, I'm using an Airtel connection and I access my account on http://www.airtel.blackberry.com/.

Once you log in, you'd probably want to add your official and personal e-mail. Setting up the email account is simple if you have a gmail account. Just enter your email address and password, it'll start delivering mails in minutes.

For your official id (for non Blackberry Enterprise Server users), blackberry will first try to automatically get the settings after you enter the e-mail/password and if it succeeds, you won't have to enter any more detail. But this could be troublesome for some, as in my case I wanted to setup using OWA (Outlook Web Access) and it picked the POP settings. A workaround is to enter the right e-mail id and a wrong password, this will throw up the settings page where you can manually select which protocol you want to use.

Lastly, I've noticed that mails sent to my gmail address are delivered instantly (using Push I guess) but mails sent to a POP or OWA account takes a few minutes to reach my phone. I guess if you are using Google for your official mails (http://www.google.com/apps/intl/en/business/index.html) then the delivery would be instant.

PHP Error after updating to 5.2.6 (Ubuntu 9.04)

After updating to PHP 5.2.6 using the update manager, I got the following error:

php: symbol lookup error: /usr/lib/php5/20060613+lfs/pdo_mysql.so: undefined symbol: php_pdo_declare_long_constant

To fix, I simply installed the php5-mysql package using Synaptic Package Manager.

Reference: https://lists.ubuntu.com/archives/ubuntu-server-bugs/2009-February/009968.html

Migrating from Outlook 2007 to Thunderbird on Linux

I recently migrated to Thunderbird on Linux from Microsoft Outlook 2007 (on Windows XP).

Following are the steps (should work for Outlook Express and older Outlook versions as well):

1) Install Thunderbird on Windows (Yes! On Windows first).
2) After installation go to 'Tools->Import'. Select Mails and then Outlook. This process might take some time and you should ensure that there is sufficient disk space available. Refer to http://kb.mozillazine.org/Moving_your_mail_storage_location_(Thunderbird) , if you want to change the location of Local Folders on Thunderbird.
3) Note the location where Thunderbird keeps it's folders (Tools->Account Settings->Local Folders will show the location). Copy Local Folders to a USB/External Drive (if the current location is not accessible from Linux).
4) On Linux, Install Thunderbird. Start Thunderbird. Configure your E-mail Account. Note the location where your local folders are located.
5) Create a 'New Folder' under 'Local Folders'(say 'Import'). Create another sub-folder inside 'Import'.
6) Go to the location where you can find the local folders. You should be able to locate the Import.sbd folder inside it.
7) From the original location where you imported the Outlook mails using Windows Thunderbird, copy contents of the Outlook.sbd folder to the Import.sbd on linux.
8) Ensure that the owner and permissions of all content under Import.sbd is appropriate (refer to the Inbox/Import folder/file permissions).
9) Start Thunderburd.

You should be able to see all your Outlook 2007 mails under the Import Folder. Initially they will all appear as un-read.

Memory leak in xcache extension of PHP

I recently encountered memory leak while using the xcache extension (version 1.2) with PHP 5.2.6.

The following code confirms the memory leak:

$data = "data";
xcache_set("key",$data);
while(1) {
$a = xcache_get("key");
echo "Memory Usage :".memory_get_usage()."\n";
}

This seems like a known issue and a worksround is suggested by oli at http://xcache.lighttpd.net/ticket/95 . Simply type-cast the data to a string while using xcache_set. The following works without any memory leak:

$data = "data";
xcache_set("key",(string)$data);
while(1) {
$a = xcache_get("key");
echo "Memory Usage :".memory_get_usage()."\n";
}

Don't know the root cause of this issue but the workaround helped.

Browsers are getting faster!!

Google Chrome has raised the bar for browser speeds as far as rendering/javascript is concerned. Ever since it's launch, all other browsers are releasing newer and faster versions one by one.

I recently tried the following browsers:

1) Opera 9.64
2) Chrome 1.0
3) IE 8
4) Firefox 3.5
5) Safari 4

Apart from IE 8 (whose javascript processing is awful) all the browsers are amazingly fast compared to their predecessors. I use to think that browsing was slow mainly because of the internet speed but it seems that the browser rendering speed has a major role to play.

Firefox 3.5 version is beta as of now but the final release should be out soon. I kind of like Firefox because of the add-ons available with it. There's just about any kind of extension that you'd like.

If given an option where all these browsers perform almost at par in terms of speed (5% here or there does not really matter) i'd use Firefox.

Tagging pattern in an element of XML using PHP

Recently I had a requirement to tag a pattern within an element of the provided XML.

Following code worked:
<?php

function replaceElementWithTaggedElement($doc, $element, $pattern, $tagNameForPattern)
{
$newElement = $doc->appendChild(new domelement($element->nodeName));

$content = $element->nodeValue;
while(preg_match($pattern, $content, $matches, PREG_OFFSET_CAPTURE))
{
$match = $matches[0][0];
$offset = $matches[0][1];
$firstPart = substr($content,0,$offset);
$secondPart = substr($content,$offset+strlen($match));
$newElement->appendChild($doc->createTextNode($firstPart));

$taggedElement = $doc->createElement($tagNameForPattern);
$taggedElement->appendChild($doc->createTextNode($match));
$newElement->appendChild($taggedElement);

$content = $secondPart;
}
$newElement->appendChild($doc->createTextNode($content));

$element->parentNode->replaceChild($newElement, $element);
}

$doc = new DOMDocument();
$doc->loadXML("<root><one>This is the first text node</one><two>This is the second text node and the word to be highlighted is second</two></root>");
$oldElement = $doc->getElementsByTagName("two")->item(0);

replaceElementWithTaggedElement($doc, $oldElement, "/second/", "tagged");

echo $doc->saveXML();
?>

OUTPUT

<?xml version="1.0"?>
<root><one>This is the first text node</one><two>This is the <tagged>second</tagged> text node and the word to be highlighted is <tagged>second</tagged></two></root>

Gearman Client and Worker with PHP

To write the Gearman client or worker in PHP there are 2 options available:

1) Net_Gearman pear package: http://pear.php.net/package/Net_Gearman/download/0.1.1
2) Gearman PHP Extension: http://www.gearman.org/doku.php?id=download

As per my experiments, Net_Gearman does not processes all requests when multiple (more than 5) simultaneous clients are sending requests.

The PHP extension available on gearman.org is better and initial tests are encouraging.

I encourage using the Gearman server and library available on gearman.org as well.