Mike Chambers announced at the onAIR tour London event last week that he would be releasing an electronic version of the Adobe AIR for JavaScript Developers pocket book, by the publishers O’Reilly, under Creative Commons licence terms. Well, good to his word, you can download the pocket reference from the Adobe onAIR website.

This book is the official guide to Adobe AIR, written by members of the AIR team. With Adobe AIR, web developers can use technologies like HTML and JavaScript to build and deploy web applications to the desktop. Packed with examples, this book explains how AIR works and features recipes for performing common runtime tasks. Part of the Adobe Developer Library, this concise pocket guide explains:

• What Adobe AIR is, and the problems this runtime aims to solve
• How to set up your development environment
• The HTML and JavaScript environments within AIR
• How to create your first AIR application using HTML and JavaScript
• Ways to perform an array of common tasks with this runtime

Also included is a guide to AIR packages, classes, and command line tools. Once you understand the basics of building HTML- and JavaScript-based AIR applications, this book makes an ideal reference for tackling specific problems. It offers a quick introduction to a significant new development technology, which lets you combine the reach and ease of the Web with the power of the desktop.

Since the Adobe Integrated Runtime (AIR) was released at the end of February, we now have a stable platform on which to build desktop applications with our existing web skills. A number of people have already started and the Adobe AIR Marketplace is filling with AIR applications by the day.

So what is the big deal? The Adobe marketing team state that:

The Adobe AIR runtime lets developers use proven web technologies to build rich Internet applications that deploy to the desktop and run across operating systems. Adobe AIR offers an exciting new way to engage customers with innovative, branded desktop applications, without requiring changes to existing technology, people, or processes.

What AIR applications should you check out?

What is intriguing is that all the tools I have chosen are generally useful tools for the developer or designer, with the exception of twhirl, which is a social-interaction tool. I’m looking forward to when other, less developer-centric tools become freely available. AgileAgenda has taken the lead with this respect, albeit not freely available, as has eBay desktop, but I would like to see examples from the BBC in the form of a desktop BBC iPlayer or maybe a Flickr image browser, del.icio.us bookmark reader, RSS aggregator and a Picnik image editor.

Analytics Reporting Suite

The Analytics Reporting Suite, by Nicolas Lierman, brings Google Analytics to the desktop. It uses it’s own custom API to interact with Google and nearly implements all the features of Analytics.

For website owners this is a must-have application. Like the twhirl AIR application below, it is a fantastic example of what can be achieved with Flex and AIR. Measuring visitor trends and traffic are essential tasks to managing and improving a websites performance. The Analytics Reporting Suite allows you to configure multiple Google’s Analytics accounts and access the web-based suite’s plethora of features via a desktop application. The application displays integrated graphs and animations via a tabbed interface, which allows you switch between a number of reports. These reports can then be saved as a PDF, Excel or XMLdocument, or printed.

You can download and install the application from the About Nico website.

twhirl twitter Client

twhirl, by Marco Kaiser, is probably the most popular desktop client for the twitter micro-blogging service. Most of the features available on the twitter website are accessible through twhirl, plus, a lot of usability enhancements have been added to make it easier to manage multiple accounts. This is great for those who want to separate business and personal accounts they may have.

The twhirl application is a great example of how AIR can bring web applications to the desktop; it can dock to the system tray, display message alerts and you can configure the applications opacity when not focused (great if you like Mac and Vista-styled themes). The application allows you to search twitter users, view their timelines, add friends, view followers, delete tweets and much much more. Twhirl automatically fetches your friends’ status updates, direct messages and replies, whilst also colour coding different types of messages and alerting you to messages both audibly and visually.

The twhirl application is skinnable and comes with several built in skins with which you can customise the application. All-in-all twhirl is not only one of the best twitter clients, but AIR applications.

You can download and install the application from the twhirl website.

Kuler Desktop

Adobe kuler is the first web-hosted application from Adobe Labs designed both to stand alone and to complement Adobe Creative Suite software. Built using Adobe Flash and ActionScript 3.0, kuler is all about colour: colour for exploration, inspiration, experimentation and sharing. Kuler is clearly targeted at the designer, but anyone interested in colour will benefit from its use.

You can download and install the application from the Adobe Labs website.

WebKut

WebKut is a web screenshot tool that allows you to capture web pages, or parts of them in a very simple way. It provides you with 3 capture options: the entire page, the current view, or only a selection. This little application proves particularly handy for those presentations or projects that need great visuals from the web.

You can download and install the application from the WebKut website.

RichFLV

RichFLV, by Benjamin Dobler, lets you edit FLV files. The key features include reading FLV metadata, read and edit cuepoints, cut FLV files, convert the sound from an FLV to MP3 format, convert an FLV to an SWF … and much more.

You can download and install the application from the Adobe AIR Marketplace website.

SearchCoders Dashboard

This Flex-based chat widget is designed with programmers in mind. The code input feature allows developers to chat about code without disrupting the conversation.

You can download and install the application from the SearchCoders website.

Pownce

Much like twhirl in look, feel and ease-of-use, but with a slant towards productivity rather than micro-blogging, Pownce is a way to keep in touch and share things with your friends or colleagues. You can send people files, links, events, and messages and then have real conversations with the recipients. This is a great collaboration tool and was one of the first services to really embrace AIR as an application architecture, which could realise their service as a desktop client. Everything that is available via the Pownce website is also available via the client application, except and possibly importantly, the ability for the user to amend their account settings and add friends to your network; this still has to be done via the website.

For a small annual amount, Pownce offers a paid-for service which will eliminate adverts from your profile and allow you to send huge file sizes (100MB) and customise the theme of your Pownce.

Pownce also offers Drupal integration and a mobile application, which works with the iPhone, BlackBerries and many more ‘internet-ready’ mobile devices.

You can download and install the application from the Pownce website.

ColdFusion has never satisfactorily removed whitespace from generated content, however, removing this whitespace can dramatically improve your website’s performance. Take a 100KB page for example. If 20% of the page is made up of whitespace, that is 20% that is unneccessary and 20% bandwidth cost that can be saved.

Currently there are two main ways a ColdFusion developer can prevent whitespace; via the ColdFusion Administrator and by including certain tags in their code:

1. ColdFusion Administrator

Under the Server Settings > Settings menu item there is a checkbox called ‘Enable Whitespace Management’. This checkbox should always be checked. According to the description, checking this checkbox “reduces the file size of the pages that ColdFusion returns to the browser by removing many of the extra spaces, tabs, and carriage returns that ColdFusion might otherwise persist from the CFML source file.” I am yet to be convinced, but it is worthwhile enabling it.

2. ColdFusion Tags

<cfsetting enablecfoutputonly="true"></cfsetting>

The cfsetting tag controls aspects of page processing, such as the output of HTML code in pages (inside and outside the cfsetting tag body). If enablecfoutputonly is set to true, HTML output is blocked if it is not wrapped in a cfoutput tag. Therefore, this tag ‘can’ be used to minimise the amount of generated whitespace.

<cfsilent></cfsilent>

The cfsilent tag supresses output produced by CFML within a tag’s scope. Therefore, you simply need to wrap the tag around anything you don’t want to output to the browser. As it does not return anything from with in it, so you have to be a little be careful when debugging.

<cfprocessingdirective supresswhitespace="true"></cfprocessingdirective>

One of the cfprocessingdirective’s purposes is to remove excess whitespace from ColdFusion generated content in the tag body. However, it does not affect any whitespace in HTML code. You can nest the tags and toggle supresswhitespace on and off, not that I ever identify a good reason to do so.

But there is a little known third way, using a servlet filter called Trim Filter.

Servlet filters are tools available to web application developers. They are designed to be able to manipulate a request and response (or both) that is sent to a web application.

Trim Filter lets you decrease the size of file your server will send to all clients. The filter removes extra spaces and line breaks from outputted documents. This can be especially useful for WAP/WML developers working with mobile devices, where the size for transferred documents is limited.

Setting up the servlet filter in ColdFusion

Using the Trim Filter servlet filter found at the following URL:

http://www.servletsuite.com/servlets/trimflt.htm

• Download the trimflt.jar
• Save trimflt.jar in the WEB-INF/lib folder in the ColdFusion Server wwwroot.
• Edit the web.xml file in the WEB-INF folder in the ColdFusion Server wwwroot with the following code:

• Restart the ColdFusion Service

And now, when a ColdFusion page is invoked, the whitespace is suppressed and wow does it do a good job.

Many people who have worked on websites know that standard HTML and CSS allows the webpage author to assign any font of their choosing to a text element on a page. However, they also know that there is no guarantee that the element will show the desired font, as the browsing user may not have the same font, or set of fonts, installed on their local system. More often than not, only a set of “common” fonts are installed, for example Arial on the PC and Helvetica on the Mac. This has been a significant issue which has been addressed by two methods: the Fahrner Image Replacement (FIR) method and the Scalable Inman Flash Replacement (sIFR) method.

Fahrner Image Replacement (FIR):

Fahrner Image Replacement (FIR), named after Todd Fahrner, one of the original creators, is a Web design technique that uses Cascading Style Sheets (CSS) to replace text on a Web page with an image containing that text. It is intended to keep the page accessible to users of screen readers, text-only web browsers, or other browsers where support for images or style sheets is either disabled or nonexistent, while allowing the image to differ between styles.

How it works:

FIR replaces short passages of text by surrounding the text in two sets of HTML tags. At runtime, CSS is used to hide the HTML element and replace it with a background image containing the exact words as an image.

FIR has come under fierce criticism from the opponents, such as Quirksmode, as it bloats the use of CSS, and Joe Clark for its failure in screen readers. FIR has largely been superceded by the Scalable Inman Flash Replacement method.

More in-depth detail can be found at the following links:

http://www.stopdesign.com/articles/replace_text/
http://www.alistapart.com/articles/fir
http://www.digital-web.com/articles/in_defense_of_fahrner_image_replacement/
http://www.sitepoint.com/article/header-images-css-xhtml
http://www.mezzoblue.com/tests/revised-image-replacement/

Scalable Inman Flash Replacement (sIFR):

Scalable Inman Flash Replacement (sIFR), originally conceived by Shaun Inman, is an open source JavaScript and Shockwave Flash based technology that enables the replacement of text elements on HTML web pages with Flash equivalents.

How it works:

sIFR is meant to replace short passages of plain browser text with text rendered in your typeface of choice, regardless of whether or not your users have that font installed on their systems. It accomplishes this by using a combination of JavaScript, CSS, and Flash. Here is the entire process:

1. A normal (X)HTML page is loaded into the browser.
2. A javascript function is run which first checks that Flash is installed and then looks for whatever tags, ids, or classes you designate.
3. If Flash isn’t installed (or obviously if javascript is turned off), the (X)HTML page displays as normal and nothing further occurs. If Flash is installed, javascript traverses through the source of your page measuring each element you’ve designated as something you’d like “sIFRed”.
4. Once measured, the script creates Flash movies of the same dimensions and overlays them on top of the original elements, pumping the original browser text in as a Flash variable.
5. Actionscript inside of each Flash file then draws that text in your chosen typeface at a 6 point size and scales it up until it fits snugly inside the Flash movie.

This all happens in a split-second, so all of the checking, replacing, and scaling is not visible to the user. It is not uncommon to notice a very short delay as the Flash loads, but to the user, none of the internals of this process are exposed.

More in-depth detail can be found at the following links:

http://www.mikeindustries.com/sifr/
http://wiki.novemberborn.net/sifr/
http://www.adobe.com/devnet/dreamweaver/articles/sifr_demo.html
http://www.mezzoblue.com/archives/2004/10/26/sifr/

The Internet has emerged from obscurity to become a dominant platform for application development and is integral to the idea of Software as a Service (SaaS). Unfortunately the demand to build applications of increasing complexity has continued to outpace the ability of traditional Web applications to represent that complexity and expectation. Utilisation of AJAX technologies attempts to reconcile some of the issues, but frequently the result is a frustrating, confusing or disengaging user experience resulting in unhappy customers, lost sales, and increased costs.

We are in a period of expanding opportunity for Internet and intranet applications. The growth in adoption and usage of the Internet has acted as a driver behind technology spending, spawned such terms as Service Orientated Architecture (SOA), Software as a Service (SaaS) and Web Services, and enterprise integration trends that seek to combine back-office infrastructures with new front-office applications and the Internet.

Integral to this is the need to communicate better with employees, customers, suppliers, and partners. Intranet applications, including enterprise information portals and employee facing applications, are increasingly depended upon to share information across a company, while outwardly focused extranet applications seek to more tightly bind networks of partners, suppliers and customers and make communication, business transactions and support easier.

A key reason Web applications cannot represent these types of complexity is because of the limitations of HTML pages. The Internet grew up on the notion of a network of loosely coupled, unintelligent clients that communicate with increasingly intelligent servers by sending requests for pages. The emergence of Rich Internet Applications (RIA’s) has served to blur the distinction between the desktop and the Web and has resulted in smart, powerful and dynamic user interfaces. RIA’s seek to combine the best of the desktop, Web and communication technologies.

As one would expect, the driving forces behind Rich Internet Applications are the big guns in the technology and Web industry; namely Adobe, Google and Microsoft. Each company has produced their own RIA platforms:

Adobe Integrated Runtime (AIR)

AIR is a cross-operating system runtime that allows developers to leverage their existing web development skills Flash, Flex, HTML, Ajax) to build and deploy desktop RIA’s.

Applications can be built using the following technologies:

• Flash / Flex / ActionScript
• HTML / JavaScript / CSS / AJAX
• Combination of these technologies
• PDF can be leveraged with any application

Adobe Integrated Runtime can be found at http://labs.adobe.com/technologies/air/

Google Gears

Google Gears is an open source browser extension that lets developers create web applications that can run offline.

Google Gears consists of three modules that address the core challenges in making web applications work offline.

• LocalServer Cache and serve application resources (HTML, JavaScript, images, etc.) locally
• Database Store data locally in a fully-searchable relational database
• WorkerPool Make your web applications more responsive by performing resource-intensive operations asynchronously

Google Gears can be found at http://gears.google.com

Micrsoft Silverlight

Silverlight is a cross-browser, cross-platform plug-in for delivering the next generation of .NET based media experiences and rich interactive applications for the Web. Silverlight offers a flexible programming model that supports AJAX, VB, C#, Python, and Ruby, and integrates with existing Web applications. Silverlight supports fast, cost-effective delivery of high-quality video to all major browsers running on the Mac OS or Windows.

Microsoft Silverlight can be found at http://silverlight.net