What is Ajax ?

Building Web Applications Just Got More Fun

Web applications are fun to build. They are like the fancy sport scar of Web sites. Web applications allow the designer and developer to get together and solve a problem for their customers that the customers might not have even know they had. That's how the blogging tools like Movable Type and Blogger came about after all. I mean, before Blogger, did you know you needed an online tool to build your Web site blog?

But most Web applications are slow and tedious. Even the fastest of them has lots of free time for your customers to go get a coffee, work on their dog training, or (worst of all) head off to a faster Web site. It's that dreaded hourglass! You click a link and the hourglass appears as the Web application consults the server and the server thinks about what it's going to send back to you.

Ajax is Here to Change That

Ajax (sometimes called Asynchronous JavaScript and XML) is a way of programming for the Web that gets rid of the hourglass. Data, content, and design are merged together into a seamless whole. When your customer clicks on something on an Ajax driven application, there is very little lag time. The page simply displays what they're asking for. If you don't believe me, try out Google Maps for a few seconds. Scroll around and watch as the map updates almost before your eyes. There is very little lag and you don't have to wait for pages to refresh or reload.

What is Ajax ?

Ajax is a way of developing Web applications that combines:

· XHTML and CSS standards based presentation

· Interaction with the page through the DOM

· Data interchange with XML and XSLT

· Asynchronous data retrieval with XMLHttpRequest

· JavaScript to tie it all together

In the traditional Web application, the interaction between the customer and the server goes like this:

1. Customer accesses Web application

2. Server processes request and sends data to the browser while the customer waits

3. Customer clicks on a link or interacts with the application

4. Server processes request and sends data back to the browser while the customer waits

5. etc....

There is a lot of customer waiting.

Ajax Acts as an Intermediary

The Ajax engine works within the Web browser (through JavaScript and the DOM) to render the Web application and handle any requests that the customer might have of the Web server. The beauty of it is that because the Ajax engine is handling the requests, it can hold most information in the engine itself, while allowing the interaction with the application and the customer to happen asynchronously and independently of any interaction with the server.

Asynchronous

This is the key. In standard Web applications, the interaction between the customer and the server is synchronous. This means that one has to happen after the other. If a customer clicks a link, the request is sent to the server, which then sends the results back.

With Ajax, the JavaScript that is loaded when the page loads handles most of the basic tasks such as data validation and manipulation, as well as display rendering the Ajax engine handles without a trip to the server. At the same time that it is making display changes for the customer, it is sending data back and forth to the server. But the data transfer is not dependent upon actions of the customer

Some of the characteristics of Ajax applications include:

· Continuous Feel: Traditional web applications force you to submit a form, wait a few seconds, watch the page redraw, and then add some more info. Forgot to enter the area code in a phone number? Start all over again. Sometimes, you feel like you're in the middle of a traffic jam: go 20 metres, stop a minute, go 20 metres, stop a minute ... How many E-Commerce sales have been lost because the user encountered one too many error message and gave up the battle? Ajax offers a smooth ride all the way. There's no page reloads here - you're just doing stuff and the browser is responding. The server is only telling the screen what changed rather than having it redraw the whole screen from scratch.

· Real-Time Updates: As part of the continous feel, Ajax applications can update the page in real-time. Currently, news services on the web redraw the entire page at intervals, e.g. once every 15 minutes. In contrast, it's feasible for a browser running an Ajax application to poll the server every few seconds, so it's capable of updating any information directly on the parts of the page that need changing. The rest of the page is unaffected.

· Graphical Interaction: Flashy backdrops are abundant on the web, but the basic mode of interaction has nevertheless mimicked the 1970s-style form-based data entry systems. Ajax represents a transition into the world of GUI controls visible on present-day desktops. Thus, you will encounter animations such as fading text to tell you something's just been saved, you will be able to drag items around, you will see some static text suddenly turn into an edit field as you hover over it.

· Language Neutrality - Ajax strives to be equally usable with all the popular languages rather than be tied to one language. Past GUI attempts such as VB, Tk, and Swing tended to be married to one specific programming language. Ajax has learned from the past and rejects this notion. To help facilitate this, XML is often used as a declarative interface language.

To prevent any confusion, these things are not characteristic of Ajax :

· Proprietary: " Ajax " is perhaps one of the most common brand names in history, but in the present context, " Ajax " is neither the name of a company nor a product. It's not even the name of a standard or committee. It's a label for a design approach involving several related technologies and open standards such as HTML, CSS, and Javascript. Each of these is "open" in the sense that its based on a published standard governed by a standards body and able to be implemented in any browser, free of legal and information constraints.

· Plugin-Based: Ajax applications do not require users to install browser plugins, or desktop software for that matter.

· Browser Specific: As long as the user is working with a relatively recent, mainstream, browser (say 2001+), the application should work roughly the same way. Browser-specific applications somewhat defeat the purpose of Ajax.