Click to see

Home Tutorials JavaScript Links
Keep an Open Eye ThePhotoFinishes Takethe5th PixofCanada Bookraft
©Imagenation 2001-2009 - If you found this page or site useful, please let others know


Sidebar 1
Open Innovation

Many of the JavaScript AJAX Frameworks presented here are Open Source in one one way or another. Only Backbase, Bindows, JackBe and Tibco have major commercial fees associated with them. But even here Backbase gives away a very solid community edition while Tibco has a complete IDE available for free download and development use while the Bindows licensing fee is well within developers reach.

So the argument can be made that Open Source has been the source of a great deal of innovation with clever UI, cross platform and cross browser tools. But one can also argue from the other side of the table and say that most of the tough design work on UI widgets and how they work was done for them by Apple and Microsoft with their desktop GUIs. Also the latest gesture and muktitouch screen operations, though influenced by Opera and others are still driven by the major OS and mobile phone vendors. And truth be told, one of the measures of the effectiveness of the JavaScript GUIs is exactly that - how well they emulate desktop widgets and components. In addition, the asynchronous access mechanism of AJAX using HTTP Request and callbacks was really developed by Microsoft in the late 1990's. True it has been refined and made to work with Web Services in novel ways in the new JavaScript AJAX Frameworks - but the pioneering innovations were done on the desktop.

Sidebar 2
Microsoft's Web Sabotage Plans?

Many may be surprised to learn that AJAX technologies like iFrames and XHR
were developed by Microsoft in 1996 and 1999. But then in 1999 Microsoft stopped all feature updates to its IE browser up to 2006. Also after promising in 1998 to have the most standards compliant browser Redmond has failed to deliver on many CSS, DOM, JavaScript and Web standards. For example, after 8 tries, its IE8 browser is less CSS compliant by a factor of 4 than Google's Chrome browser was able to achieve in its first version. Instead, Redmond maintains a growing set of proprietary extensions to IE8 and JScript while bypassing SVG, XForms, and E4X Web standards among others. In addition, JScript in the latest version of IE8 continues to trail the speed and performance of JavaScript in Google's Chrome and Mozilla's Firefox by nearly an order of magnitude. This is definitely not a good sign for Microsoft's support for AJAX. Some see it as allowing MS's Silverlight and .NET VM's to be Redmond's Windows-centric preferred Web solution while JScript takes second fiddle. Given the neglect and scheming against the Web by MSFT in the past, this concern cannot be lightly dismissed.

Sidebar 3
DHTML vs AJAX

Many Web coders will argue that there is really no real difference between DHTML which uses JavaScript + CSS +DOM to create Web programs and AJAX. And it is true that AJAX routines use the same JavaScript with perhaps more use of functions as objects in the processing. But take a look at some of the CodeThat and Tigra widgets - they certainly use functions and objects liberally. Also use of the DOM is largely unchanged . But use of CSS has seen two improvements:
1)The non IE web browser have really improved their CSS coding meeting big chunks of the CSS standard.
2)AJAX developers have created hacks and workarounds to make non-standard IE work more uniformly - often as well as the Firefox, Opera and Safari browsers.
So a deliberately cross OS, cross browser and cross device orientation of the AJAX frameworks along with their fast server connections has enabled Firefox, Opera and Safari and associated Web development to take off beyond the more limited design space of DHTML. True, CodeThat and Tigra among DHTML systems, provided a fairly broad range of widgets and GUI components but they lack the AJAX ability to manage asynchronous callbacks to the server and update just focused parts of a Web page for better response time with improved security. Think of DHTML as enabling Web 1 Widgets and AJAX as Web 2.

Cloud Computing Drives JavaScript and Vice Versa

Cloud Computing has benefited from a number of software tools including the LAMP lineup of Linux - Apache - MySQL -Perl/PHP/Python. And Flash has been a growing player with Lazlo and Flex/AIR making RIA and rich media much more accessible on the Web. But there is no doubt that the key software ingredient to Cloud Computing has been JavaScript and the growing number of complete AJAX frameworks. These tools provide not just Web based UI components equal to and sometimes better than what is routinely delivered on desktops but also provide new, faster and more robust connections to both local and server based data sources. The Net result is that JavaScript based Cloud Computing apps are often equal to and, in some cases, better than desktop computing apps.

There are well over a dozen JavaScript AJAX Frameworks which deliver a combination of GUI ease of use, strong cross platform+cross browser, integrating connections to data, and yet fast performance by clever use of client side GUI scripts linking back to data servers on an as-required basis for just the data updates required to commit data securely. Indeed, many AJAX frameworks have added clever caching and offline operations with local copies of data which then are then synchronized back to the central databases(non-trivial transaction reconciliation and management here) for system data integrity.

History

When Microsoft choked off the oxygen to the Netscape browser they almost did in the other great Netscape invention, JavaScript (see sidebar 2 for details).Redmond then worked to replace JavaScript with with its proprietary variant JScript and later VBScript by using its 95% IE market share as a launching point. But JavaScript had a life of its own already as a server side scripting language, a neutral cross browser scripting tool, and as a macro command language for tools from Adobe, Macromedia, Trolltech and other software vendors. Also JavaScript became available as Open Source alongside Perl, PHP, and other early Web scripting tools. By these means JavaScript not only survived unlike its creating organization - Netscape, but has gone on to thrive and flourish.

And the key to JavaScript's renaissance was fourfold. First, JavaScript vendors like CodeThat and Tigra/SoftComplex showed at the height of the Redmond attack on the Web that many useful GUI widgets could be delivered that mimicked very closely their corresponding Mac and Windows desktop UI widgets. And these Web widgets could be as fast and as easy to use as PC desktop equivalents and could be developed in JavaScript for use in any browser and on any platform. This first JavaScript insurgency went on almost unnoticed.

Second, AJAX coding started to take off using JavaScript's HttpXMLRequest protocol to bypass complete page refreshes with targeted requests for information from Web servers. The result was much improved response time and better service from pages that used AJAX. Google and Yahoo were the leaders of these revolutions with Google Mail and Maps showing exactly what could be achieved.

Third Macromedia demonstrated to users that Flash could deliver rich image, animation, video and even GUI experiences. And these could be brought across all desktop platforms and all browsers with its Flash player embedded best in JavaScript controlled HTML objects. Demos, presentations and even data reports could be brought to users regardless of what desktop OS or PC they used. The emergence of the Firefox and Safari browsers with their strong CSS+JavaScript support cemented the fundamental notion that the Web could deliver integrated experiences to users on Linux, Mac, or Windows.

Fourth , the rise of JavaScript frameworks from both Open Source such as prototype, Dojo, and YUI or commercial like Backbase, Bindows, and Tibco's General Interface put the icing on the cake. these tools started to deliver UI components and Web Service powered widgets and portals that simply did not have desktop equivalents. Even better, these JavaScript+CSS frameworks largely handled the problem of IE browser negligence. All of the major JavaScript AJAX Frameworks provide not only enhanced access to data but also a uniform experience to users even if they are using the Web standards deficient IE6, 7, and 8 browsers.

Web 2.0 Emergence

So OReilly and friends identified this movement as Web 2.0 - because now the Web was starting to play first fiddle - replacing the desktop applications as the agents most capable of truly delivering information at your finger tips. Using both commercial and Open Source tools, the Web became the focal point for integrating information across all browsers, all operating systems, all databases, all data+web servers and most importantly all devices (special browser-only markup like Wap/WML presents problems which new smartphones bypass).

Under Web 2 and SaaS-Software as a Service development using JavaScript on the client has become the key ingredient to the flowering of Web applications that range from Zoho, Zimbra, and Google Apps through Apex, SugarCRM, and the Web to Primavera , Facebook and Myspace. In fact just name a major desktop application and there is often a Web-based near equivalent (look at IBM Cognos BI and Oracle Primavera Project Management software for two examples). Even graphics software which due to its large CPU muscle requirements I thought would never be 'webified' now has several superior web tools available. And one of the key enablers of these Web 2.0 apps is the dozen or so JavaScript AJAX frameworks.

The Frameworks

The JavaScript Frameworks that are being discussed here have some common traits:
1)They implement not just XMLHttpRequest but also other database and Web Service based server transactions;
2)They provide hacks and fixes to make available a full set of CSS and DOM capabilities primarily patching IE deficiencies and stalled DOM standards;
3)Most of the JavaScript Frameworks run on all the popular browsers (Chrome, Firefox, IE, Opera, Safari, etc) on all the popular OS (Linux, Mac, Windows) and many popular devices (iPhone, Blackberry, Symbian, etc);
4)They implement a full set of UI windowing features often including a complete set of other GUI containers/widgets such as Accordions, Tabs, Trees, etc. They also support drag and drop and some mouse gestures but not multi-touch screen operations;
5)They implement a full set of Web forms, buttons and widgets with a rich selection of server side connections.

In sum, a Web developer using these frameworks seldom has to take a detour into hacking to implement a component or routine which emulates a desktop equivalent. These frameworks are GUI interface and database/Web server ready. The table below lists these JavaScript AJAX Frameworks.

JavaScript AJAX Frameworks
commercial=licensing fee for developer tools and/or runtime; Googlized=runtime.js files located on Google servers
Backbase commercial, huge UI widget set and new JS IDE
Bindows commercial huge UI widget set, actions, JSF to Bindows AJAX
Dojo Open Source full UI widget+ops, integration with other JS, Googlized
EXT.js Open Source derived from YUI, solid integration, Googlized
Jackbe commercial, browser based IDE, mashups with JSF, PHP, Struts
jQuery - Open Source, full UI ops, APL-array like simplicity, Googlized
Mootools Open Source, basic UI widgets, Googlized
Prototype + Scriptaculous Open Source combo, basic UI widgets, Googlized
Spry Open Source, basic UI widgets, Dreamweaver integration
Tibco GI commercial, full UI with widgets, JS IDE, server interfaces
YUI Open Source, huge widget set and great docs, Googlized

Now I certainly encourage readers to follow the links I have posted above because they take you to the heart of the demos and examples of each JavaScript framework. Users will see an amazing range of cross OS and cross browser Web capabilities:
Access to HTML tags with ability to apply a wide range of CSS formatting
Access to space-saving widgets like accordions, tabs, collapsing panels
Ability to create resizable, movable, and collapsing Windows and panels
Ability to set connections to a wide array of local or server data sources
Ability to customize, style, and combine a wide range of UI components

In sum these are first rate UIs that match and in some cases surpass what can be done on the desktop alone when they are used to mashup with various external data resources. Finally, for those users that feel there has been an omission of their favorite JS Framework - then please send me an email explaining why you think your favorite JavaScript framework should be included in our listing and benchmarks I am still looking.

The Downsides

With this embarrassment of JavaScript Framework riches it is at first hard to contemplate any downsides. But in fact the very richness of competing JavaScript frameworks also raises problems. First and nontrivial is which Javascript framework to choose. Of course speed, reliability, security, and completeness of features are the natural first choices for evaluating the JavaScripts. But ranking the JavaScript frameworks on this basis is an intimidating task because a)the frameworks are changing and improving very rapidly and b)the demands and requirements of frameworks is also changing as mobile and embedded devices expand in their hardware and basic operating system capabilities. Finally the sheer numbers of competing frameworks makes the task difficult

Second is the fact that the JavaScript frameworks do not always integrate and interact well together. To be sure, some do work well together like EXT.js with YUI and the Google JavaScript APIs. But in other cases, there are namespace clashes, incompatible data sourcing, and different feature sets which can make using two different JavaScript frameworks in the same mashup sometimes problematical. Even worse, some JavaScript frameworks have incompatible components.

The third problem is that the syntax of the frameworks are often very different. Some are XML file driven while others use proxy classes. For example, take the same task, say a simple UI Window with a Hello World message. The code for each implemented in Backbase, jQuery or Tibco GI will result in substantially different JavaScript syntax. So Web developers already confronted with polyglot problems(PHP or ASP or Python or Perl or Ruby or JSP or JSF or etc with different SQL or Object or Semi-structured or Massive database dialects and/or various types of Web Services on the Server(s) hooked into CSS + HTML + DOM + XML + JSON + SVG + SMIL + Whatever on the client) - have even more to learn with the competing JavaScript frameworks.

However, there are three other downsides which are related to basic JavaScript used by all the frameworks. First, despite constant speed improvements, JavaScript is still well behind C, C++, Java, Fortran and other compiled languages for raw execution speed(as much as 20-25 times slower than competing Java and other languages). This is important because JavaScript AJAX Frameworks themselves are getting much bigger and they are now being used to power ever larger systems. Now the browser vendors (Google, Mozilla and Safari but not Microsoft)are working overtime to supercharge their JavaScript engines. Adobe has already done so with its new AVM-ActionScript Virtual Machine which execute its superset of JavaSCript named JavaScript. So with Mozilla working on Tamarind(its JSVM) and both Apple/Safari and Google surely doing the equivalent JavaScript speed should improve dramatically over the next few years - but it will need to.

The second JavaScript problem is the upcoming upgrade of JavaScript to version 2 - also known as ECMAScript 4. This upgrade signals a major syntax change-over for JavaScript. As the Web 2 apps get ever larger, JavaScript 2 puts the language on a more secure and robust footing particularly with strong typing, scope reform but most notably - new class, interface, and package syntax. These changes make JavaScript much more suitable for the new large-scale Web 2, SaaS and Cloud Computing applications. But there is one slight problem. The JavaScript community, with the above noted exception of Adobe - have decided to table and delay the upgrade to JavaScript 2/ECMAScript 4. As we shall see just below a mixed choice.

The third and probably most serious JavaScript problem is security. Now the move to JavaScript 2 certainly would help improve the security of JavaScript code. JavaScript 2 provides tighter encapsulation in class definitions, runtime method signatures, and more comprehensive private/protected versus public values. In addition the new scope and namespace rules lower reliance on risky global variables and other necessary integration mechanics while tighter event, error, and exception processing means more robust runtime stability.

But Doug Crockford has raised some serious concerns about JavaScript security in the arena of media and AJAX. Others have raised concerns about JSON, XSS-Cross Site Scripting, and the power of JavaScript's functional programming and eval() function can leave JavaScriptings subject to potential hacker exploitation. There is currently a lingering debate on how to protect against these JavaScript vulnerabilities. In that regard other RIA-Rich Interface Architectures such as Flash/Flex/AIR and Java/JavaFx argue they are better equipped to deal with security with their hardened security models plus a variety of other problems presented by JavaScript - so lets look at these other solutions.

The RIA Tools - Flash and Java

Both the Flash and Java camps argue that they a)have a better current security record than JavaScript frameworks and b)have underlying security models and coding architecture that are better suited to providing security than JavaScript. There can be no doubt the the divergence in the underlying architecture among the 10 Javascript Frameworks plus the tabling of JavaScript 2 does lend some credence to their arguments. Now JavaScripters will counter that both Flash and Java have had a growth in security incidents - and their security models are nothing to write home about. I will point to the various references and let you be the judge of the various security arguments:

Flash however does have some ammunition in that ActionScript 3 is a JavaScript 2 superset thus ensuring a better data processing and security base (but Flash allows ActionScript 2 programming in a dual coding and runtime mode which means less than JavaScript 2 compliant programs). In addition, with ActionScript 3 and Flash Player 10, Flash runtimes using AVM2-ActionScript Virtual Machine 2 have improved speed generally and by a factor of ten in some compute intensive cases. Also the Flash runtime is a master at compressing and managing rich media such as bitmap and vector images, type, animations, audio and video which no JavaScript framework can yet match. This is important because as more Web development moves toward rich, intensive experiences - managing rich media well becomes ever more important.

But perhaps the two most important factors in Flash's favor are the "single" programming model(much less to learn)and RAIA support. "Single" programming for now is both ActionScript 2 and 3 code; but Adobe has warned developers that ActionScript 2 coding is deprecated. And third parties are now starting to supply translators. The key idea is that unlike JavaScript Frameworks, although they use the same language, their architecture and design are quite different - presenting developers with a real task if they decide that they need to integrate or migrate their JavaScript code.

RAIA means Rich Anywhere Interface Architecture. And Flash has it. This means that users can run the same code on the desktop, many mobile smartphones, a growing number of embeddeds and many other devices (Adobe just signed TV and special graphics card support with TI and Broadcom). And that code can be used offline or online or both. In effect RAIA means write once run anywhere UI software in the mold of Java's write once and run anywhere desktop and server software. Now some argue that Flash and Java are write once debug everywhere - but in comparison to Microsoft's Silverlight or many C/C++ tools (but notably not Trolltech), Java and Flash are well ahead in delivering any OS and any device capabilities.

Now Java developers will take the Flash arguments and claim they do Flash one or two levels better on security, speed of runtime operation and range of rich media supported. Now this party will concede the security point - Java has a better tested security model and more facilities for customizing the inherent Java security constraints to match the target runtime environment. Thus an embedded Java app may or may not require the same security restrictions of an online network app. And just check here for the the relative speed of Java against a variety of programming languages. Java has a 3-5 times runtime speed advantage over JavaScript.

But some readers may argue how does Java top Flash and JavaScript for rich media. Well check out the Java APIs for 2d+3D graphics, audio+video support and even animations.And with the new JavaFX tools for UI development, Java has even more UI firepower at its disposal. Finally with Codegear, Eclipse, IntellJ, and NetBeans IDEs (among many others), Java proponents will argue that Java developers have superior development, debugging and performance improvement IDEs over anything that JavaScript and Flash have to offer.

But in defense of JavaScript it can be argued that the JavaScript Frameworks a)have many more UI widgets and programmable behaviors right now than most Flash and Java UI libraries; b) are lighter and more compact and easier to code especially in the Web context; and c) have rapidly improving speed and performance as Apple, Google and Mozilla rush to release improved JavaScript engines.

Summary

The Web 2.0 Computing Cloud is driven by a number of software trends; but the most instrumental has been Javascript AJAX Frameworks. With their robust and innovative UI capable and fast AJAX connections to servers, they have made the Web the true source of Information at Your Fingertips - no matter the OS, the hardware, the servers and data sources, or even the display device (okay my wristwatch browser is really a non-functional bowser dog). But truly if a Web browser runs on the device and the device can in turn connect to the Internet, all the news fit to print will not only get through but also will be mashed up in a snappy and informative way and likely with the help of one or another Javascript Framework.

So JavaScript is now leading software development. The JavaScript AJAX Frameworks have worked around the many Redmond roadblocks in Web standards. But caution is imperative because as noted above there are serious security, runtime speed, and sheer learning problems associated with JavaScript. As well the turn towards rich media experience, a better security model, and the ability to run online or offline will make competing Flash/AIR and Java/JavaFX that much tougher. So architecting your UI system will become ever more challenging.

But like Rodney Dangerfield, JavaScript has not gotten the respect it deserves as a broad scripting language. But with its success through JavaScript AJAX Frameworks, that faltering image has changed forever. Watch for JavaScript to gain traction as a cross OS macro language, a server side scripting language, and to be used stand alone or in conjunction with Flash/AIR, Java/JavaFX as a robust UI delivery and customizing tool. And if the Google Gears and other initiatives to give Web browsing offline capabilities reach full fruition - then watch out! Finally watch for our coverage of some of the leading AJAX Frameworks in the coming weeks ahead.