Knowing AJAX

As the Internet has become more mature, rich applications featuring responsive user interfaces and interactive capabilities have become increasingly popular. The capabilities represent a way to make programs easier to use and more functional, thus enhancing the user experience.

Developers have used a variety of applications from companies such as Macromedia, Microsoft, and Sun Microsystems to add these capabilities in the past, as discussed in the “Developing Large-Scale Rich Web Applications” sidebar. However, Web applications have generally exhibited problems such as slow performance and limited interactivity, particularly when compared to typical desktop applications, noted Nate Root, research director for Forrester Research, a market analysis firm.

Now, developers are going back to the future by building Web applications using Ajax (Asynchronous JavaScript and XML), a set of technologies mostly developed in the 1990s.

A key advantage of Ajax applications is that they look and act more like desktop applications, according to Root. Proponents argue that Ajax applications perform better than traditional Web programs. As an example, Ajax applications can add or retrieve new data for a page it is working with and the page will update immediately without reloading. For instance, when users hold down the left mouse button and slide the cursor over an image on the Ajax-based Google Maps beta site (http://maps.google.com) to retrieve a part of the map not shown on the screen, the updates occur smoothly and the image appears to move and change immediately. With typical Web applications, users must spend time waiting for entire pages to reload, even for small changes.

When companies began working with the technology several years ago, before the approach even had the name Ajax, they used it for smaller, less important applications. However, as the component technologies have improved, Google and a number of other companies have started using Ajax for more important enterprise applications.

In addition to its map site, Google has worked with Ajax to build applications such as Gmail and Google Groups, a community and discussion service, said Bret Taylor, Google Maps product manager. Flickr uses Ajax in some parts of its Web site, on which users post and share photographs. For example, Ajax enables the site to let users add and view photo annotations. Expedia has produced features such as pop-up calendars on its travel site via Ajax.

All major browsers now support the technology. Thus, Ajax could pose a threat to Microsoft, Macromedia, and Sun. However, while some companies may decide Ajax is particularly useful for certain kinds of applications, industry observers say it won’t be suitable for all types. And in some cases, companies may use Ajax to complement other Web-application approaches.

Meanwhile, Ajax still faces several technical challenges, such as usage complexity and security.

WHAT AJAX IS

Developers use Ajax technologies to build Web applications with improved performance and interactivity, as well as responsive user interfaces. The applications offer functionality generally available in desktop software but not on the Web, which was designed for communications simplicity, not to enable the development of programs with enhanced capabilities.

Component technologies

Most of Ajax’s component Web technologies were developed and standardized during the past 10 years. These technologies have improved recently, making them more suitable for enterprise use.

Dynamic HTML.

Ajax applications take advantage of dynamic HTML, which consists of HTML, cascading stylesheets, and JavaScript glued together with the document object model.

The technology describes HTML extensions that designers can use to develop dynamic Web pages that are more animated than those using previous HTML versions. For example, when a cursor passes over a DHTML page, a color might change or text might get bigger. Also, a user could drag and drop images to different places.

XML.

Ajax uses XML to encode data for transfer between a server and a browser or client application. The W3C started work on XML in 1996 to enable cross-platform data interoperability over the Internet. The consortium approved the standard’s first version in 1998. XML is a markup meta- language that can define a set of languages for use with structured data in online documents. Any organization can develop an XML-based language with its own set of markup tags.

Cascading stylesheets.

A W3C standard since 1996, CSS gives Web site developers and users more control over how browsers display pages. Developers use CSS to create stylesheets that define how different page elements, such as headers and links, appear. Multiple stylesheets can apply to the same Web page.

Document object model.

The DOM, a W3C standard since 1998, is a programming interface that lets developers create and modify HTML and XML documents as sets of program objects, which makes it easier to design Web pages that users can manipulate. The DOM defines the attributes associated with each object, as well as the ways in which users can interact with objects. DHTML works with the DOM to dynamically change the appearance of Web pages. Working with the DOM makes Ajax applications particularly responsive for users.

JavaScript.

Released in 1995 by Netscape and Sun, JavaScript interacts with HTML code and makes Web pages and Ajax applications more active. For example, the technology can cause a linked page to appear automatically in a popup window or let a mouse rollover change text or images. Developers can embed JavaScript, which is openly and freely available, in HTML pages.

Ajax uses asynchronous JavaScript, which an HTML page can use to make calls asynchronously to the server from which it was loaded to fetch XML documents. This capability lets

an application make a server call, retrieve new data, and simultaneously update the Web page without having to reload all the contents, all while the user continues interacting with the program.

Enterprise application developers have become more interested in working with JavaScript because users have removed some of the technology’s bugs and developed workarounds for various problems.

Because JavaScript is a cross-platform scripting language, Ajax applications require no plug-ins, unlike Macromedia Flash and other proprietary Web application technologies.

XMLHttpRequest.

Systems can use JavaScript-based XMLHttpRequest objects to make HTTP requests and receive responses quickly and in the background, without the user experiencing any visual interruptions. Thus, Web pages can get new information from servers instantly without having to completely reload. For example, users of an application with XMLHttpRequest objects could type in a centigrade amount in one box of a temperature-conversion application and have the Fahrenheit amount appear instantly in another box.

Various browsers—including recent versions of Internet Explorer, Mozilla’s Firefox, Netscape, and Apple Computer’s Safari—work with XMLHttp-Request.

Working with Ajax

In the classic Web application model, user actions trigger an HTTP request to a Web server, which processes the request and returns an HTML page to the client. This makes technical sense but doesn’t always provide a great user experience because, for example, it limits interactivity and requires Web pages to reload for every piece of new data. Ajax applications create a JavaScriptbased engine that runs on the browser explained Forrester’s Root. Instead of

loading a traditional Web page, the browser loads the engine, which then displays the requested material.

The engine intercepts user inputs and handles many interactions, such as simple data validation, on the client side, Root said. If the engine needs more data, it requests the material from the server in the background without locking up the user interface. The engine thus lets users interact with an application independently of server communication, reducing server response wait times.