Mastering Ajax Websites

An anonymous reader writes to tell us that IBM DeveloperWorks has an interesting article introducing the uninitiated to the world of Ajax. From the article: "Ajax, which consists of HTML, JavaScript technology, DHTML, and DOM, is an approach that helps you transform clunky Web interfaces into interactive Ajax applications. The author, an Ajax expert, demonstrates how these technologies work together. Ajax is more than just the latest fad -- it's your stepping stone to build better Web sites through efficient use of your time."

Comments

Well done

[gustgr]

Interesting post. This kind of introduction might help beginners (like me) to know more about this new mix of different technologies and avoid confusion. Just these days a friend of mine said to me that he would like to learn this new "Ajax programming language". Many people still think that way. Thumbs up for the article.

Ajax in action

[gustgr]

A nice example of Ajax usage can be found at http://www.meebo.com/.

Let's Get Picky

[cataBob]

"Ajax, which consists of HTML, JavaScript technology, DHTML, and DOM, is an approach that helps you transform clunky Web interfaces into interactive Ajax applications."

DHTML is nothing more than javascript and html. And how the heck are you supposed to use javascript without using the DOM, aka Document Object Model? Talk about buzzword compliant...

Re:JavaScript code is the core code - What???

[Bogtha]

"Particular Way" for browser one ... "Particular Way" for browser two ... Sounds like in an inherently poor design.

The incompatibility you are talking about is the direct result of Microsoft implementing XMLHttpRequest with ActiveX, and everybody else implementing it as a native Javascript object. Microsoft are changing their implementation in Internet Explorer 7 to be compatible with everyone else.

So no "inherently poor design", just a historical artifact that is a) easily worked around, and b) going away.

Have you tried Laszlo?

[spoco2]

Not trying to spruik it or anything, but I'm currently working on a project of making a webapp using Laszlo.

It's an open source language/server for creating flash based applications.

We've found it to be very impressive how much you can do with so little code... and it's nice to have a proper OO backend to a flash frontend... the flash frontend means we can:

a) Make our interface very pretty and like a 'normal' application
b) Means it works in pretty much any browser...
c) on pretty much all platforms...
d) without a download of any plugin in most cases (just because of the penetration of flash)

Re:JavaScript code is the core code - What???

[LordLucless]

Depending on JavaScript could be its downfall, since JavaScript has so many functional work-arounds for each browser. Even the article mentions (but dismisses) this problem. From the article (again): Microsoft's browser, Internet Explorer, uses the MSXML parser for handling XML (you can find out more about MSXML in Resources). So when you write Ajax applications that need to work on Internet Explorer, you need to create the object in a particular way. "Particular Way" for browser one ... "Particular Way" for browser two ... Sounds like in an inherently poor design.

Im not a huge fan of AJAX, but this is one criticism you can't honestly level at it. Browser incompatibilities exist for pretty much all client-side, web-based technologies, and AJAX has only a single minor change to work around, as opposed to getting a complex CSS layout to work cross-browser. *shudder*

The simplest AJAX app relies on one piece of javascript functionality - the ability to make an http request through script. I've used this a number of times to submit data to a server when I didn't want to update the page.

Most AJAX then also relies on the ability of javascript to parse an XML document (to examine the results of the post) and some form of dynamic page-rewriting to change the current page based on the XML document (generally object.InnerHtml for content changes, or object.style for stylistic ones).

These features are fairly static - there's no need for them to change often. Simple AJAX - which is simply just offloading form submission - is good, useful, and most users don't even know it's there. As long as javascript keeps these three features, AJAX won't have major browser compatibility problems.

AJAX which rearranges the page after each XmlRequest is a bit more troublesome. It's also the flashy bit, which means its the bit every man and his dog tries to do. Using this technique, it is easy to write an entire site in one page - that is, there's one page the user visits, and the page rewrites itself based on their clicks. This is the stupidity of taking AJAX too far; you end up breaking basic functionality of the web (back buttons, refreshing, bookmarking, opening in new windows/tabs).