On-hold music for your website

Everyone knows that web surfers want snappy web sites, with fast loading times and quick responses. ZXTM™ has all kinds of whizzy features to accelerate your web site. But even then, sometimes you will have to cope with the odd slow and complicated request. How do you keep your web pages feeling snappy, and more importantly, keep that potential customer glued to your site?

There are lots of studies showing the impatience of web surfers - in 1997, users were only willing to wait ten seconds for a web page to load. Times have changed. People have become more impatient. In 2006, users would only tolerate loading times of four seconds. As these trends continue, our annoyingly impatient customers will want pages to be available instantly by 2012. (You had better pre-cache all your web pages by then!)

So what is a poor struggling webmaster to do? Sure, some web pages will load fast. But other, more dynamic pages are going to take longer to generate. Complicated site searches, large database updates, or even worse, stupid 'Web-3.0' XML and SOAP handling, all take their time. We need to keep our customers' attention, lest they wander off and spend their precious money elsewhere.

There is some good news! We can just take the techniques used in other industries and apply them to the web. For example, think of phone call centers. How often have you phoned a company, only to be placed on-hold? Why not bring the joy of on-hold music to your website?

Doing so is surprisingly easy, and even better, doesn't need any extra plugins installed on your customers' browsers. When a client connects to your web site (through ZXTM), TrafficScript™ can spot if the page is taking some time to load, and if so, start to pipe back an mp3 file while waiting for your moribund excuse for a webserver to generate the real page data.

There's no need to make a new connection to stream the mp3 back. The client already has a TCP connection open to ZXTM, and all recent web browsers will auto-detect the MIME-type of the content they receive. So even if the web browser was trying to view a JPEG graph of your company's share price, it will happily accept the soothing tones of Eminem as the mp3 file is streamed across the Interweb.

The TrafficScript to accomplish this is included at the end of this article. In the ZXTM UI, create a new request rule, copy in the code and assign it to the virtual server that you want to improve. Then, copy the mp3 file you wish to use into ZEUSHOME/zxtm/conf/extra/pleasehold.mp3. Voilà!

The next version of ZXTM will have further improvements to the TrafficScript API to simplify these features. New functions might include:

connection.putOnHold()    - starts the music
connection.selectMusic()  - select music genre (Classical or thrash metal?)
music.loop()              - for those extra slow pages
music.fadeOut()           - yay, page eventually loaded.

Other TrafficScript rules could aid your revenue generation. Perhaps your site could use a 'Buy It Now' button, then bored customers can purchase the on-hold music while they wait? Hey, if Starbucks sell music, why not you too?

Here's the full TrafficScript. Sorry for the binary data in it:

# Max time delay (in seconds) - 2009 timeouts here, see graph
$delay = 2;

# mp3 file (might need .wmv for Windows / Internet Explorer)
$mp3 = resource.get( "pleasehold.mp3" );

# Binary prefix to ensure browser accepts music
$prefix = "IF9fX19fX18gIF9fX19fX18gIF9fX19fX18gX19fX19fX19fIF8gICAg" .
"ICAgCiggIF9fXyAgKSggIF9fX18gKSggIF9fX18gKVxfXyAgIF9fLyggXCAgICAgIA" .
"p8ICggICApIHx8ICggICAgKXx8ICggICAgKXwgICApICggICB8ICggICAgICAKfCAo" .
"X19fKSB8fCAoX19fXyl8fCAoX19fXyl8ICAgfCB8ICAgfCB8ICAgICAgCnwgIF9fXy" .
"AgfHwgIF9fX19fKXwgICAgIF9fKSAgIHwgfCAgIHwgfCAgICAgIAp8ICggICApIHx8" .
"ICggICAgICB8IChcICggICAgICB8IHwgICB8IHwgICAgICAKfCApICAgKCB8fCApIC" .
"AgICAgfCApIFwgXF9fX19fKSAoX19ffCAoX19fXy9cCnwvICAgICBcfHwvICAgICAg" .
"IHwvICAgXF9fL1xfX19fX19fLyhfX19fX19fLwogICAgICAgICAgICAgICAgICAgIC" .
"AgICAgICAgICAgICAgICAgICAgICAgICAKIF9fX19fX18gIF9fX19fX18gIF9fX19f" .
"X18gIF8gICAgICAgIF8gCiggIF9fX18gXCggIF9fXyAgKSggIF9fXyAgKSggXCAgIC" .
"AgICggKQp8ICggICAgXC98ICggICApIHx8ICggICApIHx8ICggICAgICB8IHwKfCAo" .
"X18gICAgfCB8ICAgfCB8fCB8ICAgfCB8fCB8ICAgICAgfCB8CnwgIF9fKSAgIHwgfC" .
"AgIHwgfHwgfCAgIHwgfHwgfCAgICAgIHwgfAp8ICggICAgICB8IHwgICB8IHx8IHwg" .
"ICB8IHx8IHwgICAgICAoXykKfCApICAgICAgfCAoX19fKSB8fCAoX19fKSB8fCAoX1" .
"9fXy9cIF8gCnwvICAgICAgIChfX19fX19fKShfX19fX19fKShfX19fX19fLyhfKQog" .
"ICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKCgo=";

# Prefix the music stream
$mp3 = string.regexsub( $mp3, "^.*", string.base64decode( $prefix ));

# Only alter delayed responses
if(( sys.time.highres() - $delay ) > 0 ) {
   http.sendResponse( 200, "", $mp3, "" );
}

# Let the page continue

Ben [Zeus Dev Team] 01 April 2008   1 comment