Which Open Source AJAX Framework is Right for You?

Principal Consultant

Jeff Szeto
Developer and Architect

So you've decided to use AJAX in your next project.  AJAX is a hot technology and some solid AJAX experience would certainly look good on your resume.  Your main challenge is to get this evil plan implemented and the code working before your pointy-haired manger notices and puts a stop to your fun.

The good news is that AJAX technology has matured to the point where there are many good frameworks that will make this plan a success.  The tricky part is choosing the right AJAX framework for your project. 

To help you make just the right selection, we have prepared this review of several popular frameworks and recommendations for determining which one is right for your project.  Let's get started with some context on AJAX technology.  We'll then look at some popular frameworks and our recommendations for the best use of each framework.

Adopting AJAX presents some good news and bad news.  The good news is that your users will have a smile on their face.  AJAX adds the responsiveness of a desktop application to web applications.  Without AJAX every user input requires a lengthy round trip from the browser to the server reminiscent of a late '80s mainframe terminal.  With AJAX you can selectively update portions of the current page without reloading the entire page.  Sure, the browser still needs to complete a request and response cycle to the server, but this work is done asynchronously on a separate thread without blocking user interaction.  And that's where the bad news crops up.

Programming an asynchronous application is more complex - a callback (response) resulting from a request can come back at anytime.  This problem maybe more familiar to anyone who has developed a GUI.  The widely used tactic is to adopt an event driven programming model.  This is all easy enough when you have useful objects such as events, event listeners, and cool widgets ready for use.  However, the built in support for AJAX in browsers is much more low level and harder to use.

The built in AJAX support is the XMLHttpRequest object.  The typical usage pattern is to give the XMLHttpRequest JavaScript object a POST to the server and register a callback function to handle the server response.  However, what you get back is some XML.  To do anything useful with this XML you'll likely need to apply some transformations (the server is likely to return content lacking the presentation formatting) and insert the result into the browser's DOM for display.  What you would really like is transparent binding to useful objects on the client and server sides without having to deal with the XMLHttpRequest object.  That's where frameworks come in.

Frameworks will address more of less of this problem.  Some frameworks apply only on the browser side and provide client side bindings to JavaScript objects.  Other frameworks go further and also include client side management of the request and response cycle, and perhaps marshaling and unmarshaling of request to the server.  In the best case a framework will provide snazzy widgets to spice up your presentation.  Other frameworks are even more inclusive and will also handle bindings to native objects on both the client and server sides.  Most frameworks will also take care of cross-browser support which is a serious issue when dealing with the XMLHttpRequest object and browser DOM.

If you start a new project, it is very suitable to pick an AJAX framework that provides both client and server side support.  However, if you are adding AJAX to your existing project, you may want to pick an AJAX framework that can easily integrate with your existing code.  Adopting a client side AJAX library is a great option if you want to minimize changes to your existing code.  Some frameworks also provide server side support that allows reuse of existing code. 

Another factor to consider is your skill base.  If your framework choice is based on an unfamiliar language you may spend a lot of time learning the new language.  There are many frameworks available and it is quite likely that you can find a suitable framework that will make the most of your programming skills.

Client Side Library

A client side library is a set of JavaScript files you can include in your web page using a <script> tag (See Figure 1 for a context diagram).  These libraries typically provide a JavaScript API that you can use on your web pages so you don't need to know how to make asynchronous calls, marshall/unmarshall request.  More importantly, they are often written to support all major browsers (IE 6, IE 7, Firefox, etc.).

It doesn't matter if your project is simply a plain HTML web site or a sophisticated J2EE web application, chances are you should have no problem integrating a client side library with your project immediately (unless you are using some weird web framework which prevents you from inserting any scripting into pages).  Below are descriptions of three popular AJAX JavaScript libraries (ordered alphabetically) to help you to decide which library is right for your project.

Figure 1.  Context Diagram for an Ajax application which shows a client side library and a server side framework.

Dojo Toolkit

Besides the typical API for handling AJAX requests, Dojo also comes with a long list of widgets you can use immediately.  Out of the box, Dojo comes with complex widgets such as a slider, datepicker, googlemap, menubar, toolbar, tree and etc (here is a complete list).  Widgets supported by Dojo have an event system which allows interaction with other widgets on the same page.  Also, Dojo provides excellent support for object oriented programming such as class methods and properties, multi-level inheritance, and also implements aspect-oriented programming concepts.

Dojo is a great choice if your project requires complex widgets.  However, Dojo is a full-featured JavaScript web toolkit and tends to be more heavy in term of download size when compared to other AJAX client side libraries.  So, if you are looking for a library to just handle AJAX requests, Dojo may not be your best option.


Needless to mention JQuery includes API for handling AJAX requests, JQuery also provides a simple-to-use API for accessing and creating DOM elements on-the-fly.  It also provides a powerful API for traversing and manipulating DOM elements.  One unique feature provided by JQuery is effects and animations.  As simple as one line of code, you can easily create an animated effect on any DOM element (e.g. making a table row hide slowly when a user clicks on a "hide" button for that row).

JQuery has a very lightweight footprint (< 20KB in size for download).  If your project requires quick page loads JQuery will not be a burden.  JQuery also focuses on code conciseness so code using JQuery tends to be dense.  However, it does not support a reusable programming model like an object oriented approach, so you should not expect thousands of lines of JQuery code to be a good asset to your project (unless you're not the one who has do the maintenance).


Quite similar to JQuery, Prototype supplies simple-to-use and concise API for accessing and manipulating DOM elements and handling AJAX request.  Prototype's concept is to extend JavaScript objects such as String, Number and DOM element with additional methods.  You can call something like "string.isBlank()" to check if a string variable is blank.  It also comes with a large collection of helper functions and extension API like other AJAX client side libraries.

Prototype is quite similar to JQuery in terms of AJAX features. There is no obvious reason why a project should use Prototype but not JQuery beside the fact that your team members may be more familiar with one or the other.

Server Side Support Framework

This kind of framework provides server side support for interacting with JavaScript and often comes with both server side components and client side JavaScript libraries.  Most frameworks in this category provide server side API so they can be easily integrated with your existing code; some even provide a complete suite of components to allow you to build your AJAX web tier from the ground up.  Here are some popular server side frameworks you should know about:

Direct Web Remoting

If your project is Java based, you definitely want to check out the Direct Web Remoting (DWR) JavaScript library.  DWR allows JavaScript in a browser to seamlessly interact with Java on a server.  This capability is powerful - you can write your AJAX GUI to interact with your domain objects as well as business logic in the same way as making Java method calls.  DWR does the magic behind the scenes by marshaling data back and forth between a provided Java Servlet and JavaScript.

DWR also supports integration with popular Java frameworks such as Spring, Struts, WebWork, and Hibernate.&nbsp; The current version (1.X) only supports one way communication - JavaScript on a browser executing Java on a server.  Version 2.0 aims for reverse AJAX - allowing Java on a server to call JavaScript in a browser.

If your project is Java based, DWR provides a great option for allowing your new AJAX GUI to interact with your existing server-side Java objects.


For Java developers, Struts is the most widely used open source web application framework.  Struts 1 is so popular that it is virtually the standard for Corporate J2EE application development.  Struts 2 adds built-in AJAX support based on the Dojo toolkit.

Choosing Struts as an application framework is a very safe choice as many large scale sites are based on Struts, er, Struts 1 that is.  Struts 2 was released for general availability in February of 2007 and is complete re-write of Struts 1.  It is Apache software which is typically of high quality.  However, you may want to wait a little while before basing a major project on Struts 2.


Google Web Toolkit is an AJAX web application framework that makes the most of your Java talents.  During the development cycle you develop in Java with the Swing like GWT class libraries.  The application is deployed after being compiled to DHTML and JavaScript by the GWT compiler.

This is seems like a scary idea but it turns out to be the best of both worlds.  Java has a really strong tool chain.  You can use your favorite IDE (Eclipse or Net Beans) and even debug the application using a Java debugger as the application runs in a JVM during development.  Integration to server side Java code is very easy as GWT supplies Real Simple RPC that automagically allows passing of Java objects between the browser and the application server.  The other great feature is that the compilation to DHTML and JavaScript takes care of cross-browser support by deferring browser specific code to dynamically loaded JavaScript modules.

GWT is a natural choice if you are starting a new project and have good Java skills.  Your productivity will be high right from the start.

Ruby On Rails

Ruby on Rails is a very popular web application framework that has native support for AJAX.  Ruby On Rails is known for having a low entry barrier and small footprint.  Ruby on Rails is based on convention over configuration.  For anyone who has spent days pawing through XML application server configuration files, this is a true selling point.  You do have to know that Ruby as it is the scripting language which Rails is based on.

Rails' AJAX support is based on Prototype and a set of helper tags.  Just like the built in support for server side CRUD operations, the built-in AJAX support is seamless and hand crafted client side JavaScript is not needed in many cases.

Rails is an excellent choice if you are starting a new project.  You'll have to assess if your team has the language skills or is willing to learn Ruby.  If you do make the leap chances are you'll be raving about Rails' ease of use.


If you are a true fan of JavaScript, Phobos might be the web application framework for you.  If JavaScript is good for the client, why not use it on the server side?  This is the thinking that has lead to Phobos.  Phobos is based on the Rhino JavaScript interpreter.

Using JavaScript on the server side actually makes a lot of sense as it can lead to faster development.  Major applications such as Amazom.com have been implemented with scripting languages on the server.  PHP is a prime example of server side scripting.  Phobos is not ready for prime time so we can't recommend it just yet.  If you are a JavaScript fan, keep your eyes on this project and your chance to bring that JavaScript expertise server-side.


An AJAX client side library allows for quick integration of AJAX into an existing project.  Since it is a direct integration at the page level by including JavaScript files onto the pages, there is almost no restriction on the kind of web framework used in your project.  Most popular AJAX client side libraries provide JavaScript API for handling AJAX requests, accessing and manipulating DOM elements, and also cross browser support.  These frameworks often provide aids for JavaScript programming in terms of conciseness and code maintainability.

However, you should be aware of the fact that you are still writing JavaScript - a scripting language that is less maintainable and reusable when compared to languages such as Java and C.  You should continue to follow best practices and separate GUI and business logic even though an AJAX client side library can make page scripting much easier than before.

Server side frameworks are best when embarking on a new project and you don't have to integrate with an existing code base.  Adopting a framework can really boost your productivity.  The alternative of building you own infrastructure will be harder and take longer.

Adding AJAX components to your next project is a great idea.  You'll quite likely end up with an easier-to-use product and your customers will like it better.  We've suggested a few interesting frameworks here; there are many others available.  Take the time to select and adopt a framework to make your next project a success.

About the authors

  1. Jeff Szeto is a developer and architect with over 15 years of experience in enterprise application development.  He is a Sun Certified Java Architect and Programmer and holds a Masters degree in Computer Science from Virginia Tech.
  2. Marty is a Principal Consultant with Beaver Creek Consulting Corp.  Marty has 10 years of professional experience as a Software Developer and specializes in developing finance and accounting solutions.  Marty is a Sun Certified Java Programmer with expertise in J2EE and database systems.  He holds a Doctorate in Chemical Engineering from the University of Virginia.

This article first appeared at MrBool.com at: http://www.mrbool.com/articles/viewcomp.asp?comp=5311

Last Update: 20070510