Skip navigation.

Building Rich DHTML User Interfaces Revisited

A lot of people have already figured out how to build DHTML apps like GMail, but Jon Udell's comments are worth a post:

As early adopters discovered long before I did, there's an architecture behind this JavaScript/DHTML wizardry. The best description I've found is from Johnvey Hwang, who deconstructed Gmail's JavaScript code and created a .Net-based Gmail API. As Hwang described in his July 5 write-up, Gmail loads a JavaScript UI engine into your browser at the beginning of each session. Oddpost, he noted, was the first Web mail application to perfect this technique. That was a prophetic statement: Just four days later, on July 9, Yahoo acquired Oddpost.

There are quite a number of tools out there to help you build rich user interfaces using Javascript and HTML. Some are free and others are commercial. Here's a short list i compiled a while back:

Rich Clients

- Nexaweb

- General Interface

- Lumen Software

- Bindows (5 Nov 04)

- Backbase (5 Nov 04)

- NexUsEdge (8 Nov 04)

Tools

- Prototype Protoype enhances the existing JavaScript features of browsers so that they're a lot less painful to use. Prototype gives us the $ function, which is a shortcut for document.getElementById (e.g. $('content')). Prototype provides functions for event handling, array handling, form scripting, DOM manipulation and remote scripting (Ajax) (20 Feb 2006). See SitePoint Prototype tutorial (22 Feb 2006).

- Rico is a Javascript library built on Prototype that supports Ajax, Drag-n-Drop, Cinematic Effects, and HTML Behaviours (20 Feb 2006).

- Zimbra is an impressive open source toolkit that will be the foundation of Apache Kabuki (20 Feb 2006).

- Yahoo! User Interface Library, a Javascript library contributed by Yahoo to the open source community (20 Feb 2006).

- Dojo is a big, complicated library and apparently does everything possible in Javascript (20 Feb 2006).

- JSRS: Mature browser to server communications library. I use it myself. Works with PHP, Perl, Ruby, ASP, Python, JSP, etc.

- xajax: Applications developed with xajax can asynchronously call server-side PHP functions and update content without reloading the page (4 Aug 2005).

- Mishoo's javascript components: calendar, rich text editor, etc.

- HTTPRequest: good article on using GET/POST and XMLHTTPRequest.

- JPSpan: One of the newest browser to server libraries specially designed for PHP.

- ThinLet (8 Nov 04)

- script.aculo.us - web 2.0 javascript Effect and Drag n Drop library built on top of prototype (3 Aug 2005)

- SACK - Simple AJAX Code Kit JavaScript library (3 Aug 2005)

- youngpup.net - DOM-Drag Lightweight JS Drag n Drop lib (3 Aug 2005)

- Monket Calendar GPL AJAX online Calendar written in PHP+JavaScript (3 Aug 2005)

- Accesskey Underlining Library Easy way to add access keys to any html page without changing the actual html (4 Aug 2005).

- Rasmus Lerdorf's 30 Second Ajax Tutorial (4 Aug 2005).

- AjaxAC is another PHP/Javascript framework (4 Aug 2005).

Other Platforms

- Ajax.NET - The free library for .NET (C#) Full Featured C# ajax lib (3 Aug 2005).

- DWR - Direct Web Remoting AJAX library for Java (4 Aug 2005).

- Ajax on Rails: Rails is a Ruby framework (4 Aug 2005).

Flash-based

- Open Lazlo (8 Nov 04)

- MacroMedia's Flex (8 Nov 04)

Discussion Points

- Crouching Javascript, Hidden PHP: Part 1 and Part 2.

- What Working Group

- Joel on Software's notes

- Jon Udell's followup on the weaknesses of rich clients (10 Nov 2004).

- Alex Bosworth has compiled a list of Ajax Mistakes (24 May 2005), and Adam Bosworth (dad) responds.

- Some links to articles on tuning Javascript for high performance DHTML (4 Aug 2005).


I'd love to hear about your experiences with any of the above software, or if you know of any other javascript tools that you think deserve to be on this list. Post your views in Add New Comment.