Playing With ExtJS

I've worked with the JavaScript framework jQuery before and I've heard of Ext JS but I wanted to try it for myself. Essentially the main difference between jQuery and Ext is that while jQuery works great tacked on top of other JavaScript frameworks like ASP.NET or JSF, Ext is more of a replacement for those frameworks. Coding in Ext feels like Swing or Windows Forms but for the browser.

Since Ext forms live completely inside the browser's memory space there isn't a postback every time you click a button or expand a tree node like there is in ASP.NET. I think the delay from a postback makes the user experience feel choppy, especially if you don't have a fast internet connection. ASP.NET makes it very easy to hook into any DOM event, but since these event handlers live on the server, hooking into these events causes a postback which in turn causes the whole page to reload. Moving all this event handling logic to the browser makes the application seem a lot faster.

Since it requires so much JavaScript coding (and so little HTML coding), you should invest in a good JavaScript editor. Ext Designer is a WYSISYG drag-n-drop editor for Ext controls. The pricing seems kind of steep to me, $219 for a single developer license, but I suppose that if you're going to use it a lot then it's probably worth the money. Take a look at the screenshot of Ext Desinger below.

There's a list of controls on the left. You drag a control onto the form, re-size it, edit its properties and preview the whole form. It's very easy for laying out the form (especially if you're not familiar with Ext). You can even setup all the data sources (AJAX calls) for controls, like the grid or the tree, and then preview the form with real data. The major shortcoming is that it's only a UI designer - there is no integrated code editor. You have to export the project to add all the program logic and event handlers via another editor like Eclipse. On the other hand, using the designer in conjunction with another editor isn't particularly difficult if you have the designer project saved in the same folder as the rest of your application, its just a little painful to have to switch between applications, I suppose.

This being my first experience with Ext I have to say that I'm relatively impressed. JavaScript has come a long way since the days of dial-up modems and table-layout. With the dawn of efficient browsers and HTML5 I think creating true fat client web applications is a reality. In a follow-up post I am going to talk about CouchDB and how using Ext with CouchDB could possibly replace the need for server-side code altogether.