5 Ways to Use Ajax and 5 Things to Watch Out For

Ajax has changed the way Web applications are made and is still a source of innovation for developers.

by Herman Mehling

Sep 9, 2010

Although Ajax has officially only been around since 2005 -- when the term “Ajax” was coined -- its history and impact stretch back to the 90s. In 1999, Microsoft introduced a method for its browser to retrieve data over HTTP in the background (asynchronously).

A few years later, developers refined that asynchronous capability to make it possible to pass input to a web server, retrieve results and provide output - all without a page reload.

[login]
Heady stuff in those days, and in these days. Ajax has changed the way Web applications are made, and is still a source of innovation for developers.

Ajax is not a programming language but a combination of technologies. The core ones are: HTML, XHTML and CSS for presentation; XML for the interchange of data; XSLT for data manipulation; the Document Object Model for dynamic display of and interaction with data; and Javascript, which acts as the glue for the other technologies. VBScript is another client-side scripting language that can be used, although JavaScript is the most popular one as it is compatible with most web browsers.

Here are five ways you can leverage the power of Ajax, said Gareth Price, software architect at www.webstandard.com, a website development firm.

Real-time content updates

Java lets developers present new data to users without them having to click refresh.

Example: Twitter.com feed

When you're viewing tweets and you've been staring at the same page for a couple seconds, Twitter uses AJAX to send you a small notification of how many new tweets there are, all without having to refresh the page.

Other scripting tools require users to refresh a page before they can view any changes.

Auto-complete text fields

Ajax can be optimized to deliver rapid results to a user's query, even when the query consists of only a letter or a couple of letters. Each time a user presses a key, Ajax is used to pass the query to the server and present results.

Example: Google search bar

Form validation and submission

Forms are still the primary method to get detailed input from users - and they can still be confusing. "Using Ajax, you can present validation data in real-time - highlight the text field and show users where they went wrong," said Price.

Rich UI

"Desktop application developers used to look down on web apps," said Price. "Not any more, look at Google Docs, for example."

External data (mashups and widgets)

"Thanks to Ajax, You're not limited to pulling data from your own server," said Price. "You can pull from anywhere that lets you." Example: Google AdSense.

5 Things to Watch Out For

Ajax-created pages are invisible to the browser's history, back button, and bookmarks.

There are workarounds, but page loads are still a better way to present distinct, static content, said Price.

Most solutions to the bookmark problem use the URL fragment identifier (the portion of a URL after the '#') to keep track an application in a given state and allow users to return to it.

AJAX interfaces only display when Javascript is enabled

Any user whose browser does not support JavaScript or XMLHttpRequest, or has this functionality disabled, will not be able to properly use pages which depend on Ajax.

Some devices, such as mobile phones, PDAs and screen readers, may lack support for Ajax.

The solution: use non-JavaScript technologies.

Polling the server many times can overwhelm it with requests

The solution, noted Price, is "to tune your system appropriately, or throttle it during busy periods."

Dynamic pages

The Dynamic page updates of some Ajax applications may interfere with user interactions, especially if the user has an unstable internet connection.

The solution is trial and error testing.

Talking to XMLHttpRequest is complex and verbose

"jQuery lets you make an Ajax request in one line," he said.

As a tool to enhance the user experience, Price said the best Ajax creation is that which users don't notice. All they should know is that your application is fast, sleek and easy to use.

Herman Mehling has written about IT for 25 years. He has written hundreds of articles for leading computer publications and websites.