Comparison between Ajax and Flex

Ajax and Adobe Flex are popular Web development technologies used to create rich Internet applications. They can be used separately or in combination. Ajax developers often use an Ajax framework to speed up development. Flex developers use Adobe's tools for development. This article compares Ajax frameworks with Adobe Flex.

About this Comparison

Adobe Flex is a single-vendor product (proprietary to Adobe) while Ajax is a collection of techniques to create web applications that is not specific to a vendor. With Ajax the following options can be considered:

* Custom Ajax (develop from scratch)
* Open Source Frameworks (Dojo Toolkit, , Prototype, jQuery, Xajax, MooTools)
* Commercial Frameworks (Backbase, Spry, Bindows)

The comparison below will take these options into account when comparing Ajax with Flex.

Other RIA Technologies

There are more technologies that can be used for building RIAs, other than Ajax and Flex. A full list can be found in the rich Internet application article.

Interoperability

Ajax and Flex can also be used together. There are two tools available to facilitate this integration: the Flex Ajax Bridge and Ajax Data Services.

Comparison of Product Capabilities
Runtime

Adobe Flex relies on the Flash 9 browser plug-in, which needs to be present in the browser of the website visitor. Ajax uses the various Internet browsers as its runtime. Some Ajax Frameworks have an additional JavaScript engine that abstracts away from differences in browser implementations: developers use the engine which in turn communicates with the browser.

The benefit of using a proprietary plug-in as Flash 9 is the controlled runtime environment, which is identical across all web browsers. This makes development easier and it allows Adobe to add additional features and to improve performance. The downside is that the plug-in needs to be installed, which can pose a problem in environments with locked-down operating systems. Adobe periodically publishes data on the market penetration of the Flash Player. Some critics of Flash, such as Jakob Nielsen in an article published October 10 , 2000 , state that reliance on a plug-in is a break with web standards, as the web browser is only used to launch the player which does not use web standards such as HTML, CSS and JavaScript. The Flash plug-in offers some support for HTML, CSS and an extended version of JavaScript (ECMAScript).

The benefit of Ajax is that it runs in various web browsers, without the need for a plug-in. The downside is that there are differences between browser implementations of DOM, JavaScript and CSS, which can result in Ajax applications that work in one browser, but not in another. Ajax Frameworks mitigate this issue by offering a browser compatibility layer. Another downside of Ajax is that it requires JavaScript to be enabled in the web browser. It is possible to make Ajax applications degrade gracefully when JavaScript is disabled, but this requires additional application design.

Development

Flex has a declarative development model, in which the application is defined with XML tags. Additional programming is done in ECMAScript. Styling can be added using CSS.

Ajax can be programmed in JavaScript or with Ajax frameworks that offer a declarative programming model (e.g. Backbase). Ajax styling is also done with CSS. There are also server-side Ajax frameworks that allow Ajax programming with JavaServer Faces (e.g. ICEfaces and Backbase) or .NET (e.g. Telerik and Infragistics).

There are many IDEs that can be used for Ajax development. They include:

* Generic IDEs such as Eclipse and Microsoft's Visual Studio
* Dedicated Ajax IDEs such as Aptana
* IDEs bundled with Ajax frameworks

Some Ajax frameworks develop their IDE on top of an existing IDE. For example, Backbase uses Eclipse. Other Ajax frameworks develop their IDE in the web browser, often using their own framework, such as Tibco GI.

Adobe Flex has its own , named Adobe Flex Builder, which is based on Eclipse.

Adobe bundles a framework for automated testing with Flex, while for Ajax most existing web page testing tools can be used.

Performance

RIA performance consists of various aspects, such as the size for the initial download, the speed of the runtime, and speed of data manipulation.

Flex applications have a minimum initial download size of approximately 125 kilobytes (which does not include the applications themselves -- just the libraries to run them), which users may consider slow on dialup connections. With the release of Flex 3, Adobe implemented the framework caching - caching allows for a user to only have to download the framework once from any Flex application. Ajax programs can be very small, although most frameworks introduce a certain initial download size, ranging from several kilobytes to a megabyte (when taking both the application and the libraries together). Flex applications are already compressed, while for Ajax, GZip compression on the web server is typically used to compress the files.

The performance of Ajax applications is based on the performance of the browser, which can vary from one browser to another. Frameworks such as Backbase and Jackbe have optimized the performance of their framework across browsers. Adobe optimizes the
Flash Runtime for performance, and therefore has more control over performance. One of the benefits is that Flex can handle large data sets on the client-side, while Ajax requires more optimization to get good performance, especially in Internet Explorer. The best Ajax frameworks can handle more client-side data than other frameworks, due to careful optimization strategies.

Widgets

Adobe Flex comes with many user interface widgets in different skins. Custom Ajax does not come with pre-built widgets, but many Ajax frameworks do, ranging from a couple of widgets to over 100. Some Ajax widgets are stand-alone, while others are tightly integrated into an Ajax framework, using the framework’s underlying functionality for event handling, drag-and-drop, resizing, sorting, and so on. An underlying framework makes it easier to customize or extend widgets, and to create completely new widgets. Some Ajax frameworks come with multiple skins for the widgets.

Extensibility
Following the release of Flex 3, Adobe launched an Open Source initiative for the Flex SDK. so it also can be extended by external code contributions. Create custom component in Flex is very easy. Ajax is typically more extensible, because Ajax runs in browsers instead of a proprietary runtime. Custom widgets can also be created with Ajax and Ajax frameworks simplify this task by providing reusable functionality. However, many proponents of Flex will argue that with externalAccess they can take advantage of the browser's extensibility. This has led to a number of hybrid Flex/Ajax apps.

Multimedia

Flex uses multimedia capabilities from Flash, such as vector graphics, animation, image manipulation, audio and video. Ajax does not have multimedia functionality built-in, but can use other browser functionalities and plug-ins such as SVG and Quicktime, or even the Flash plugin. Flex offers more integrated multimedia development experiences as its feature is well-documented and consistent. The multimedia for Ajax is generally achieved through hack and mashup.

Server Communication

Ajax uses the web browser’s underlying communication mechanism, which is HTTP. This supports pulling data from the server, as well as pushing data to the client using server push. Remoting is supported by various Ajax frameworks such as DWR. Adobe Flex also supports binary communication.

SEO and Web Analytics

Ajax and Flex are often used to build web applications that are not very content-rich. However, if there is a fair amount of content that needs to be indexed by search engines, search engine optimization (SEO) techniques become relevant. Adobe Flex has limited support for SEO because content cannot be read and indexed directly by search engines, which instead use meta data and HTML shadow pages to index Flex applications. HTML within Ajax applications can be indexed by search engines, although search bots cannot follow links that are generated by JavaScript logic. Proper application design can make Ajax applications fully accessible for search engines.
Web analytics typically works well with Ajax applications, as all HTML files that are loaded can be tracked, even if they are loaded into an existing page. What happens within a Flex application is hidden from web analytics tools.

Accessibility

Adobe Flex is Section 508 compliant. Some Ajax frameworks such as Bindows and Backbase are also Section 508 compliant, but most other Ajax applications are not.

Security

Both Flex and Ajax run in the browser’s sandbox, and are generally seen as equally secure, though the Flash plug-in can introduce additional security risks. Most Ajax code is plain text and thus easy to read: this could make it easier for attackers to find vulnerabilities or for third-party developers to report them or fix them.

Non-Functional Comparison

User Experience

Adobe has attempted to make Flex as user friendly as possible. However, critics of Flash such as Jakob Nielsen claim that Flash-based applications have inherent usability issues because visitors are used to using web pages as interfaces for web applications. Critics of Flash cite usability limitations such as the following:

* Flash apps have a different feel: the cursor looks different, fonts look different, links and right-click does not work as expected
* Back-button/Deep-Linking support requires use of classes and is not supported by default

Flex proponents state that many of these issues can be addressed with proper application design and thorough usability tests.

Standards Support

Both Flex and Ajax support many web standards. Ajax uses a standards-based runtime (the web browser) that supports many standards out-of-the-box. Since Ajax is dependent upon the browser's implementation of these standards this can lead to inconsistencies in the rendering and behaviors of an Ajax application across different browsers forcing developers to add "browser sniffing" into the code to accommodate these incompatibilities, or else employ frameworks that perform the required "browser sniffing" and so obviate the need. Flex uses a proprietary runtime that has implemented support or partial support for many standards. The Adobe Flash runtime has the benefit of being reliable in its implementation regardless of the OS or browser being used. Any standard that is available in web browsers is readily available for Ajax applications depending on the browser version installed. Adobe has to implement new standards into its Flash runtime before they can be used, but Flash does support automatic updating to its latest version.

Vendor Support

Flex has the support of a large vendor - Adobe. Ajax in general is not supported by a vendor, though some Ajax frameworks provide support and several open source Ajax projects are supported by their developer community on a voluntary basis. Most commercial Ajax vendors provide support plans, ranging from basic email support to 24x7 phone support with a service level agreement.
 
< Prev   Next >