Building Rich Internet Applications with Frameworks

JavaScript libraries, ICEfaces, Adobe Flash 4, Microsoft Silverlight, and now, HTML5 have been competing for web dominance as the world wide web is thrown into a new era — an era dominated by rich internet applications (RIA for short). The purpose of this article is to define what RIAs are, explain why the web has been moving towards RIAs, explore the different RIA frameworks that exist today, give an overview of the pros and cons for each framework, and discuss how these new technologies might coexist in the future.

What’s an RIA?

An RIA, or rich internet application, is a web application that behaves like a desktop application.

Before RIAs began popping up, most web applications were composed of static pages. Sumo Paint is an Flash-based RIA, functioning like a graphics editor software such as Photoshop. Unlike desktop applications, any interaction with a web page usually resulted in reloading a whole new page. Desktop applications, on the other hand, had much better user interactivity because all of the processing was being done natively on the user’s machine, resulting in a more seamless user experience.

As a result, software developers began to ask themselves, “Should my product be a desktop application or a web application?” It has always been a fair question, because both types of applications have very strong pros and cons. Desktop applications have smoother user interactivity, but require distribution and dealing with software updates when the software has shipped. Web applications, on the other hand, are easily accessible from the web, freeing it from the problems related to software distribution and updates, but were very lacking in user interactivity.

So how can we have the best of both worlds? RIAs are the best of both worlds. RIAs are distributed through the web, and have very rich user interactivity.

Since the advent of Ajax, a method for web applications to make server requests with JavaScript without reloading a web page, new technologies have been popping up left and right to join the RIA movement. Among these technologies are frameworks that help developers build and deploy rich internet applications, such as JavaScript libraries, ICEfaces, Adobe Flash 4 (formerly Flex 3), Microsoft Silverlight, and HTML5. Let’s talk about these RIA frameworks one by one.

JavaScript Libraries for Web Application Development

JavaScript libraries like jQuery and MooTools were one of the first technologies to really help deploy slick and interactive rich web apps. They provided a framework for an RIA application that leveraged client-side scripting to handle front-end interface functions.

They are basically JavaScript files that comprise of a collection of useful, cross-browser-tested functions for doing things with Ajax and dealing with common user interactions like hiding and showing content based on a user-driven event. Some of the most popular ones today are jQuery (especially with jQuery UI), MooTools, YUI (Yahoo! User Interface library), and ExtJS.

All these libraries include RIA components like grids, graphs, and complex form elements, as well as utilities to handle Ajax. Best of all, most great JavaScript libraries for web development are open source. JavaScript libraries are good to use if you don’t want to pay for an integrated development environment (IDE) but still want great-looking and professional RIA functionality in your website.

Sites using JavaScript libraries include Google, Digg, Yahoo, Amazon, Microsoft, Twitter, and Best Buy.

ICEfaces

ICEfaces extend the standard JavaServer Faces (JSF) framework and is intended to simplify the programmer’s workflow by removing JavaScript from the equation. In other words, ICEfaces handle all of the JavaScript/Ajax for your web application via Java APIs.

This greatly simplifies the task of creating rich internet applications by removing some of the complexities introduced by building custom JavaScript functions. ICEfaces is good to use if your team is made up mostly of Java developers, if your web application doesn’t require other complex components that ICEfaces doesn’t offer, or if your web application is event-driven. If your app is event-driven, make sure that you understand that ICEfaces doesn’t offer true “server pushes” in the sense that HTML5, Flash Builder 4, and Silverlight can.

Instead, it uses a long polling method to simulate server push. Sites using ICEfaces include Boeing, NASA, Union Pacific, T-Mobile, and Bank of America.

Adobe Flash Builder 4

Flash has been around for a long time, but building entire web applications out of Flash used to be more trouble than it was worth until the introduction of Flex, which is an extension to Flash that provides RIA web components.

What makes Adobe Flash Builder 4 so exciting is its cross-platform and cross-browser nature, allowing it to run exactly the same way across all operating systems and all browsers. Comparing it to JavaScript, where browsers have varying JavaScript engines that handle and process your code, Adobe Flash has one engine that your users install via the Adobe Flash browser plugin (which more often than not, they would already have). Flash Builder 4 applications can do this because they are embedded into HTML pages, meaning that the browser itself has no effect on the application’s performance.

This means that you can run even the most complex web applications correctly in IE6 if you wanted to (this is of course a simplification because the Flash plugin/engine regularly gets updated, so it would slightly depend on the user’s version of the plugin). These applications are usually accompanied by server-side processing like a Java backend and need the Flash Builder 4 IDE for development. Adobe Flash Builder 4 is good to use if your web application requires complex graphics, if your team is made primarily of Java developers (because it works well with Java), or if your application uses an event-driven architecture.

Sites using Flash for web applications include Mint.com, Flickr, and Hyundai.

Silverlight

Silverlight is basically Microsoft’s version of Adobe Flex/Adobe Flash. It has been gaining some traction, but doesn’t seem to be catching up to Adobe Flash in terms of popularity.

Silverlight applications are obviously bound to have a .NET backend because it’s a Microsoft product. This means, though, that you’ll have tighter Silverlight/.NET integration versus Adobe Flex/[some server-side scripting language like PHP]. Silverlight is a good option if your web application requires complex graphics, if your team is made primarily of .NET developers, or if your application uses an event-driven architecture.

Sites that use Silverlight include Netflix.

HTML5

HTML5 is the latest development in the RIA movement. HTML5 is, in essence, the result of merging the best of HTML4, JavaScript, CSS, JavaScript libraries, and Flash into a single specification that leverage the API model.

HTML5 is an open technology, which means there isn’t going to be a single governing body like Adobe for Flash or Microsoft for Silverlight. Since HTML5 specifications is not yet complete, and IE9 has not yet been released (read about new IE9 features), you’ll need to wait a little bit before building a production-ready HTML5 web app. Currently, all major browsers support HTML5 except for IE8 (go figure).

Since IE8 has a major portion of the browser market, HTML5 really won’t go mainstream until IE9 is released. Once HTML5 becomes widely supported, it will be good to use if you don’t want to buy or learn an IDE (which you would need for frameworks like Flex and Silverlight), your application uses an event-driven architecture, or if you would rather use built-in HTML functionality and JavaScript APIs rather than using third-party JavaScript libraries for basic RIA functionalities. Although HTML5 can handle graphics very well, using Flash and Silverlight for complex graphics and animation is still easier/faster at the moment.

The Future of RIAs

Are HTML5 apps the future of the internet? Not exclusively. As long as there are creative and innovative web developers out there who are driven to create something special, there will always be new technologies that can provide amazing things that HTML5 or any other web technology won’t be able to offer.

Creativity and innovation are the reasons why JavaScript libraries, ICEfaces, Flash, Silverlight, and HTML5 came into existence in the first place. The future of the web will be made up of many coexisting technologies, just like it is today.

Related Content

• What is The Future of Web Development?
• 10 Promising JavaScript Frameworks
• Getting Started with the iPhone SDK