Things you wanted to know about Ajax and Javascript...
Posted by admin on March 28 2007 20:09:35

I have a hunch that most of my audience knows what Ajax is about and knows about Javascript but probably hasn't done too much of it themselves. So I thought I might throw you some introductory stuff wrt to the latest developments in the Ajax and Javascript world.

It's not just about talking back to a server asynchronisely and we rarely actually return any XML in the result of that async call - so the acronym "Ajax: Asynchonise Javascript and XML" is a bit of a misnomer these days.

More often than not, when an async call is made back to the server, either no content is return - just an OK or Fail state - or more javascript is sent to be executed. Also, these days, you'll see plenty of JSON being sent back and forth between client and server as well.

So if it's not just about async calls, what else is going on here? - well there's been plenty of work in all aspects of the UI and core objects for Javascript. It all starts with one library: Prototype. This library gives us a heap of simple extensions to the core javascript across all the different browser implementations for quick access to elements, ajax calls, periodic updaters, event handling.. you name it, if it's core to javascript, Prototype has made it easier.

Prototype became famous for two things: 1) it's simple to use Ajax routines and 2) it's $() syntax for finding elements. Many other frameworks are based off prototype now and it's no surprise, since when you start doing any real with in javascript, you cannot live without it.

The next exciting library is one that many haven't heard of before: Behavior. This library gives us a very special trick - the ability to add javascript actions and transformations to arbitrary elements on a page matched using regular CSS rules. Some examples include the ability to add drop-shadow effects to elements simply by giving it a css class of 'drop-shadow'. But generally you use this library to keep things clean and simple in your main page - or in otherwords, javascript re-use and encapsulation. Interestingly enough, this is essentially like doing functional-programming on the client side.

The next library is one almost every one has heard mentioned at some point or another: Scriptaculous. This library is even used by Apple now in some of their products. What is it? Essentially it's an uber animations library for Javascript. It includes fades, transforms, resizes, skews, combinations of these effects, sortable lists, drag and drop... plenty of nice eye canding and basic UI functionality that was generally missing from javascript to begin with.

Scriptaculous was made more famous because it became part of Ruby on Rails fairly early on. It has also been integrated in to Seaside. One really nice new feature in this library is the ability to morph the styling of an element from one set of CSS to a new set of CSS. Nice colour cross fading and the like.

And finally, to wrap this up we have the mother of all javascript libraries: Dojotoolkit. This library contains all things UI at the widget level - autocomplete, comboboxes, lazily built tree lists, form error handling, client side stored data, RPC mechanisms in javascript, floating window panes, rich content editing field, tabs, dynamic content loading, javascript based layout engine,.. boy the list goes on with this library. It's fairly heavy weight compared to the other libraries - but it is worth it if you're serious about making your web browser look good.

The nice thing about all these libraries is that they can work side by side without treading on each others toes. They also compliment each other nicely, providing missing functionality that the others don't have. They also all work really well across different browser implementations - reducing the cost and effort required to make your site work properly.

So if you're starting to get in to this technology and you're interested in javascript and what it can do - hopefully this'll give you a few places to start your explorations.