Skip to Main Content
1 Million Project for 50k
How to get software projects done at a fraction of the cost.
  • RSS feeds
Home :: technologies Web design Web Technologies Explained

Topics

  • 1M Project for 50K
  • Web Technologies Explained
  • Working with Web Developers

Site Links

  • About Magic Web Solutions (UK)
  • About this blog

Ajax versus Flash

Posted October 18th, 2007 by NickJ
in
  • technologies
  • Web design
  • Web Technologies Explained

Ajax & Flex Technologies

 

We can all see the changes happening on the web nowadays, in the web 2.0 era - sites  load faster, they are more interactive and often contain audio/video information; sections on a page are updated independently according to user actions, thus the web application is more responsive and generates less traffic; the user interface has become almost as convenient as using a desktop application.

 

Ajax

 

AJAX (the abbreviation for Asynchronous JavaScript and XML) is not a new technology. The ability to send requests to the server without reloading the page was implemented by Microsoft in Internet Explorer 4.0, but it has been widely adopted in the last 2-3 years, after AJAX support was added to Mozilla/Netscape, Opera and other browsers.

 

 

As its name states, the data from the server should be in XML format, however, to reduce the time and resources required to parse an XML response, JSON (JavaScript Object Notation) was invented. JSON ensures that the response from the server conforms to a specific data structure that can be easily parsed by the JavaScript code.

 

Any modern browser will support AJAX without any additional configuration, which makes this technology a perfect candidate for improving existing sites. But AJAX will require writing JavaScript code to process the data from the server and you will need to deal with browser inconsistencies.  Fortunately, there are a lot of AJAX frameworks which let developers concentrate on the business logic – at MWS we use DWR with Java backend and AjaxAgent with PHP.

 

Using AJAX means using a lot of Javascript code to dynamically update page contents, so it’s a good idea is to use a Javascript framework (here we use Mootools) to provide a consistent cross-browser JavaScript API, but it will require some time to learn and adopt.

 

Finally, we’re experienced with Bindows – very sophisticated, commercial Javascript/AJAX framework, which ships with a rich collection of widgets for a better user experience.

 

Flash/Flex

 

Flash started out as a vector animation tool, but from 2000, when Flash 5 was released, it became possible to exchange data with servers in URL-encoded and XML format.

 

In order to view a Flash website, users have to download & install the Adobe flash plug-in, but the installation is easy and all browsers and operating systems are supported.

 

Magic Web Solutions created a highly interactive Flash-based web mail interface in 2001 which received very good user feedback. Sporting a familiar Windows look, it offers similar interface elements such as “drag and drop” functionality, pop-up windows, virtual toolbars and tool tips.

 

 

However, programming in a Flash environment was still tightly bound to the animation timeline, which had existed in Flash from the very beginning and entailed a steep learning curve. Macromedia (now Adobe) had always had a strong developer community and in order for new programmers to embrace Flash technology quickly, they invented Flex.  Flex features the new ActionScript 3.0, an object-oriented, strongly-typed programming language, the Flex component framework and FlexBuilder IDE built on top of the widely adopted Eclipse framework, which gives many Java & PHP developers the same familiar environment.

 

Flash/Flex also has a built-in streaming video support and (with the latest player update) H.264 hi-quality video support.

 

A brief comparison

 

Let’s try to compare Flash/Flex versus AJAX on some key areas:

 

UI Capabilities

 

Both Flash & AJAX support dynamic content generation, drag & drop, effects & transitions. But with Ajax you’re limited to the set of predefined effects supported by CSS. With Flash as a vector/bitmap animation tool you can replicate virtually any effect. There are also a number of ActionScript effects libraries available. Flash wins over AJAX in charting – at the moment Flash is the only option if you want to have dynamic and highly interactive charts in your application. We have produced a highly complex solution for Germinate

 

To use video streaming in flash you will need Flash Media Server or use an open-source alternative, Red5 server.

 

Magic Web Solutions is also working on a Language Portal: A web-based platform for foreign language teachers to create content, and for students to access and use this content.

 

 

Usability, Accessibility

 

Flash used to have an infamous ‘back button’ problem – when the browser back button was clicked the user was forwarded to the previous website instead of navigating to the previous screen in the Flash application. Fortunately this is not a problem anymore – Flex and Flash components support back button out of the box.

 

 

Both AJAX & Flash/Flex applications can be made accessible to the people with disabilities.

 

It is worth mentioning here that Flash content cannot be indexed by search engines at the moment, so you will need to prepare HTML pages if you want them to be indexed.

 

Data Connectivity

 

AJAX supports XML & JSON formats; Flash supports them as well and in addition you can also send/receive custom binary data over persistent socket connection, thus you can have a POP3 or IMAP email client built with Flash.

 

 

Another powerful data-exchanging technology, Flash Remoting, allows data to be sent and received via HTTP protocol using binary AMF (Action Message Format) protocol.

 

Flash Remoting supports data type conversion automatically and is natively supported by Flash player, which makes it one of the most efficient ways of exchanging data with a server.  Flash Remoting implementations are available for Java, .NET, PHP and Perl.

 

Recently Adobe released LiveCycle Data Services (formerly known as Flex Data Services) which provides automatic and manual synchronisation of a common set of data on multiple clients and server-side data resources and also supports offline client-side data persistence for occasionally connected clients. At the moment only Java backend is supported.

 

Speed of loading, rendering and client-side logic

 

Latest Flash player versions are based on AVM2 (ActionScript Virtual Machine v2) which has significant performance improvements and can easily cope with a complicated, form-rich user interface.

 

 

Flash remoting also loads data faster than AJAX, however it only becomes noticeable with large amounts of data.However Flash applications are almost always bigger in size than AJAX applications, but they are usually cached in the browser so next time it will be loaded from browser cache.

 

Mobile & hand-held devices support

 

There are numerous browsers that currently support Ajax: Opera Mobile (not Mini), IE Mobile, Nokia S60 3rd edition and Minimo (Mozilla). However, DOM manipulations cause heavy CPU and memory load.

 

 

With Flash it’s not much better – existing applications will likely not work out of the box due to excessive CPU & memory load. Adobe has a separate mobile version of Flash player called Flash Lite which is supported by latest mobile and hand-held devices.

 

As you will have seen, Flash provides much more than simply the ability to exchange data with the server, but that does not necessary mean that if you want to improve your website you will definitely need Flash. Those technologies can perfectly work together – you can call Flex functions from JavaScript and vice versa. If you feel your website needs a facelift or you need a Rich Internet Application developed from scratch – we will be happy to help you select the best technology for your project.

  • NickJ's blog

Post new comment

The content of this field is kept private and will not be shown publicly.
Input format
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Lines and paragraphs break automatically.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Lines and paragraphs break automatically.

More information about formatting options

Recent comments

  • Very helpful
    5 weeks 3 days ago
  • Martin, thanks for your
    22 weeks 3 days ago
  • Recording your VoIP Conversations is also a great feature!
    22 weeks 5 days ago