Ajax (shorthand for asynchronous JavaScript and XML) basically is just about creating web request asynchronously. Not much programmer used it until google using it on their applications, gmail. The technology used by gmail (Ajax) is not new technology, it was already on IE5 (known as XMLHttpRequest) since 1999. But the brilliant idea how using it on gmail makes ajax popular. Lesson learned: it’s not about using new feature or technology, but using [old] technology creatively to solve your problem.

Today, Ajax and javascript is the core part of web based rich client user interface. Popular javascript library or framework make us easier to build rich client user interface. With numbers of available library, next question is which one you will choose? Well, I think it will depend on your needs.

You can use javascript library like prototypejs, mootools, jquery or others and combine it with your existing web based applications. You can get more user friendly or “fancy” web based application by using those tools. Your existing web page might be will not much change. But you can also build web based application by using very rich user interface by using Extjs. Extjs not only provides Ajax tools and simple effects, but it also provide page layout control and form control, you’ll see that Extjs based applications is just like desktop based applications.

So, which type of library will you use?

Based on my experience, if you used it for native web applications (fancy user interface, using background picture to attract customer): use solution type 1, but if you want to build data intensive web based applications, you can use solution type 2.

I’ll give you real case. For ecommerce application, you can use solustion type 1 (prototype, mootools, jquery etc) and combine with your existing web to get new user experience. If you see at www.armaniexchange.com and view the product details, you’ll see the web pages using jquery to create new user experiences like: zoom effects, popup image and image gallery. In this case, they still need html page and css which have more flexible and fancy design to attract customer.

You migth use solution type 2 like Extjs to support your backend applications. The user interface of Extjs is monotone (if you compare it to html+css web page), but this type of library is suitable for data intensive applications. You can create a record of a product catalog just like you create it in desktop based applications, insert picture, search data and view it on data grid. Users already familiar with desktop based applications for this kind of tasks.

The picture below show how you can use Extjs to create backend applications. This is the real case from application that I built a year ago, tuneeca.com (ecommerce applications).  The pictures show small part of the applications. First picture show you user interface to manage catalog data, and second picture show you user interface to manage sales. The last picture show you how you can create tab based applications and show each module in a tab. Using this solution, you only need to load page once.

Catalog Management User Interface

Catalog Management User Interface

Sales Management using Extjs

Sales Management using Extjs

Application's Tab

Application's Tab

Well, this is just simple guide how you can use different type rich client user interface and Ajax in your applications. Consider wisely which type of library you’ll use, or first questions before you use the library, do you really need those library? The library cost bandwith, and library like Extjs also cost performance of browser.

,
Trackback

no comment untill now

Add your comment now