Web 2.0 In Depth
The OpenAjax Technology Vision: Accelerating Customer Success with AJAX
Committed to Open Technologies and Architectural Diversity
Jun. 8, 2007 10:45 AM
OpenAjax Fulfilling AJAX's Promise
One would think that an industry would slow down as it matures, but the Web has proven to be just the opposite. Innovations are happening at breakneck speed. Companies have to move faster than ever to keep up and survive.
AJAX is clearly a case in point. The term "AJAX" was first mentioned publicly in February 2005 by Jesse James Garrett. But roughly 18 months later, we have hundreds of companies delivering AJAX products, dozens of AJAX open source projects, and nearly everyone in the industry planning to adopt AJAX techniques as part of their future Web development strategies.
OpenAjax How It Was Born
In late 2005, thanks largely to the globetrotting of David Boloker, IBM's CTO of Emerging Internet Technologies, a small number of leading companies brainstormed about how to ensure that AJAX fulfills its potential as the industry standard rich application platform based on open technologies. These early discussions came to a climax on Feb. 1, 2006, with the announcement of the "OpenAjax Initiative,"whose 15 original members included BEA, Borland, the Dojo Foundation, Eclipse Foundation, Google, IBM, Laszlo Systems, Mozilla Corporation, Novell, Openwave Systems, Oracle, Red Hat, Yahoo, Zend and Zimbra.
Between February 1 and May 15, another 15 organizations joined "OpenAjax,"and the (then) 30 members held a two-day kickoff meeting in San Francisco to lay out the blue-print for the initiative moving forward. At the meeting, the group decided to call itself the OpenAjax Alliance, defined its mission, agreed on an interim organizational process, and established its initial activities. Today, the organization has more than 50 members and is growing rapidly.
OpenAjax Alliance Mission and Objectives
The OpenAjax Alliance is an organization of leading vendors, open source projects, and companies using AJAX that are dedicated to the successful adoption of open and interoperable AJAX-based Web technologies. The prime objective is to accelerate customer success with AJAX by promoting a customer's ability to mix and match solutions from AJAX technology providers and by helping to drive the future of the AJAX ecosystem.
The set of technologies under the OpenAjax banner will provide the following benefits to Web developers:
- Lower development costs and faster delivery of Web 2.0 innovations
- Vendor choice and interoperability
- Richer web experience and greater collaboration that can be added incrementally to existing HTML websites or used for creating new applications
The OpenAjax Alliance will provide value to the software community through both marketing/communications and technical channels.
Marketing and communications
The OpenAjax Alliance will engage in various educational and communications activities. Its Web site will provide a standard vocabulary for industry terms such as "AJAX" and "OpenAjax," and will include whitepapers and block diagrams on AJAX technologies and associated best practices, with a focus on cross-vendor interoperability. Representatives will speak about OpenAjax at conferences and other industry events.
The OpenAjax Alliance Web site will provide a central point of information about the OpenAjax vision, explaining how to adopt AJAX successfully so that IT developers will feel confident about their technology and vendor choices.
Technical Committee Work
Most of the technical work is accomplished in committees. The following committees were established at the initial kickoff meeting in May:
- Marketing / Architecture Committee This committee produces the
Alliance's architecture vision documents, which help the IT manager and developer understand the AJAX landscape, the various AJAX technology alternatives (e.g., client-side AJAX toolkits vs. server-side AJAX toolkits), and criteria by which a product or technology is OpenAjax-compliant.
- Interoperability Committee - This group focuses on the ability to mix
- Declarative Markup Committee - This group focuses on HTML/XML markup
interoperability issues. Among the topics so far is mixing markup (HTML and/or XML markup) from different AJAX toolkits within the same Web application.
It is likely that other committees, such as a Mobile Committee, will be formed and begin work soon.
The Alliance is committed to royalty-free, unencumbered technologies in a manner that is friendly toward inclusion within commercial software products.
How OpenAjax Alliance Differs from Established Standards Bodies and Open Source Initiatives
The Alliance will purposely avoid competition with existing open standards and open source initiatives and instead will collaborate with and support any relevant open technology initiative.
To date, more than 50 organizations have joined the OpenAjax Alliance, including:
American Greetings (AG/Interactive)
eLink Business Innovations
The Front Side
Open and Interoperable: The OpenAjax Technology Vision
The Alliance's mission is to accelerate customer success with AJAX by promoting a customer's ability to mix and match solutions from AJAX technology providers and by helping to drive the future of the AJAX ecosystem.
The members of the Alliance have worked together to produce a shared AJAX technology vision that is described in this article. The most fundamental aspects of the technology vision were established during the two-day kickoff meeting for the alliance (May 15-16, 2006). The rest of the vision is the result of the Alliance's committee work since the kickoff meeting.
Getting the Best of Web 2.0 and 1.0
First and foremost, the OpenAjax Alliance's technology vision represents a commitment towards open technologies. The Alliance believes that a large part of industry excitement over AJAX is due to its promise of rich user experiences through open technologies; therefore, open technologies are central to the OpenAjax technology vision.
Another reason for industry excitement with AJAX is that it promises the benefits of Web 2.0 through incremental adoption of new application development techniques while retaining the existing back-end infrastructure that has been set up around HTML. But AJAX frameworks deliver AJAX benefits in many different ways. Some AJAX frameworks do most of the AJAX work on the client, while others do most of the work on the server. Some AJAX frameworks integrate tightly with server application frameworks such as JSF; others move large parts of the application logic to the client. The OpenAjax Alliance embraces this diversity because it promotes innovation and provides customers with a rich set of choices, thereby enabling them to choose the AJAX technology approach that best matches their needs and preferences.
OpenAjax builds on the open technologies that are native to browsers.
Open source and commercial products
While open source software is not mandatory for AJAX projects, a large part of AJAX's momentum is due to the open source community's commitment to AJAX. OpenAjax embraces open source alternatives and seeks partnership with both AJAX open source initiatives and commercial products.
Platform independence (OS, server, browser, IDE)
One of the main attractions of AJAX is that it does not lock developers to a particular hardware platform, operating system, application server, web browser or IDE. Developers are free to choose among many technology providers, commercial and open source, to find the products or open source technologies that best match their unique requirements and preferences, while achieving the key benefit of write-once, run-everywhere, across multiple computing devices, operating systems, and web browsers.
Multiple architecture options
AJAX developers have the ability to choose among multiple technical approaches to find the ones whose programming model best fits their needs. The following are some of the ways to categorize AJAX toolkits and frameworks.
Client-side vs. server-side
Client-side AJAX transformations
Figure 1 shows a common approach to client-side AJAX.
The developer provides the green-color components, the AJAX toolkit provides the orange-colored components, and the yellow-colored components represent the final HTML DOM after the AJAX runtime library has performed its client-side transformations.
For client-side AJAX, the application server usually requires no additional AJAX-specific server software. All AJAX transformations come from the client-side AJAX runtime library.
One advantage of this option is the independence from the server side technology. The server code creates and serves the page and responds to the client's asynchronous requests. This way either side can be swapped with another implementation approach.
Server-side AJAX sometimes follows the model shown in Figure 2.
The implementation strategies of server-based AJAX frameworks vary. At one side of the spectrum, the server handles all the application events. On the other side of the spectrum, many events are handled on the client. For some frameworks, the development and debugging phase handles all events on the server, but in production mode many events are handled on the client.
Single-DOM vs. Dual-DOM (client-side and server-side)
The Single-DOM approach is particularly well-suited for situations where the developer is adding islands of AJAX capability within an otherwise non-AJAX DHTML application, as the programming model matches the traditional approach used in DHTML applications.
Other AJAX runtime toolkits adopt a Dual-DOM approach that separates the data for the AJAX-related markup into an "AJAX DOM" tree that is kept separate from the original "Browser DOM" tree. Figure 4 illustrates the Dual-DOM (client-side) approach:
With this approach, in model view controller (MVC) terms, the AJAX DOM can be thought of as the model, the Browser DOM as the generated view, and the AJAX runtime toolkit as the controller.
It is usually necessary to establish bidirectional event listeners between the AJAX DOM and the Browser DOM in order to maintain synchronization. Sometimes having a separate AJAX DOM enables a more complete set of XML and DOM support, such as full support for XML Namespaces, than is possible in the Browser DOM.
Some AJAX technologies combine server-side AJAX transformations with a Dual-DOM approach (see Figure 5).
In this scenario, the primary job of the client AJAX engine is to reflect back to the server any interaction state changes. Most of the UI logic is handled on the server.
Server-side Dual-DOM enables tight application integration with server-side development technologies such as Java Server Faces (JSF).
The OpenAjax Alliance has a commitment to open technologies and architectural diversity.
A key part of the Alliance technical work are its technology initiatives focused on AJAX interoperability. The OpenAjax Hub, one of the Alliance's first interoperability initiatives, prevents collisions and enables linking together of multiple AJAX technologies within the same Web application (see sidebar).
OpenAjax Hub: Enabling AJAX Togetherness
The following features have been identified for the first version of the OpenAjax Hub:
1. AJAX library loading and unloading control - The Hub will have APIs that AJAX libraries must invoke when those libraries are initialized, identifying load and unload callback functions which are invoked at document load and unload time. The Hub manages and coordinates the invocation of these callback functions. The callback functions must be non-destructive outside of the global objects that the library has registered with the Hub (see next item). Markup handling should not occur as part of the load event callback function; instead, markup handling should occur via callback functions that are invoked by the Hub's markup scanner (see below).
3. Event hub - The event hub allows libraries to publish and subscribe to events in a reliable manner in order to coordinate actions across components from different AJAX libraries.
4. Markup scanner - The OpenAjax Hub controls markup scanning at the highest level. At initialization time, AJAX libraries identify to the Hub the pattern matching criteria for the markup that the given library controls. When the Hub scans the document, whenever it encounters markup that matches the criteria, it invokes the library's appropriate callback function.
Unlocking Productivity and Flexibility Gains with OpenAjax
AJAX is an industry phenomenon. Hundreds of companies, including industry heavyweights, have announced AJAX products, and dozens of AJAX open source projects have been launched. Most Web developers say they are already using AJAX or plan to use AJAX in upcoming projects in order to achieve next-generation user experiences, improve developer productivity, and lower bandwidth requirements.
However, various challenges remain for AJAX to achieve its potential and deliver its full set of benefits. Some of these challenges are informational - providing the industry with easy access to information on how to be successful with AJAX. Other challenges are technical - today's AJAX products work well, but do not interoperate with other AJAX products. In recognition of these various challenges, leading companies and open source projects have joined forces to create the OpenAjax Alliance, whose mission is to take on these challenges to accelerate industry adoption and success with AJAX.
In this article, I provide an overview of what the OpenAjax Alliance envisions as the applications that AJAX and OpenAjax will enable and the value proposition that we want to see fulfilled as quickly and completely as possible.
More Productive End-Users, Lower BandWidth, and Strong ROI
In most businesses, decision makers are interested mainly in how information technology can increase revenue, reduce costs or make better use of information assets. Factors that are typically considered include:
- Time spent waiting for data to be transmitted. Over many repetitions, the time employees spend waiting for pages to load can add up to significant costs.
- Time spent completing a particular task. Inefficient user interfaces can translate into long periods of lowered end-user productivity.
- Bandwidth consumed for the entire task. If repetitious tasks consume considerable bandwidth, IT costs can grow dramatically.
AJAX technologies help with all of the above. Because AJAX supports dynamic and continuous user experiences, user productivity increases significantly and measurably (e.g., seconds-saved-per-transaction x number-of-transactions-per-year). Because AJAX provides similar advanced user interface features to those in desktop applications (e.g., advanced UI controls, animated effects and adjustable layout controls) thereby providing the visual and interaction tools needed to make the application self-explanatory users spend less time learning and operating the application. AJAX's partial page update feature offers reduced communications overhead versus HTML's traditional approach of click, wait, and then full-page refresh.
Next-Generation Applications (Web 2.0 and RIAs)
Replacement for desktop applications
AJAX offers a desktop-like user experience while retaining the benefits of server-based application deployment, centralized infrastructure administration, easier scalability and immediate availability of application updates to all users. As a result, AJAX is accelerating the movement away from installable, two-tier, client-server applications to multi-tier web applications.
The runtime companion for SOA
As the natural evolution of HTML, AJAX's platform-independent runtime technology is well-suited for next-generation service-oriented architecture (SOA) applications. AJAX offers standards compliance and platform independence on the client, while SOA offers similar benefits on the server.
Mashups, dashboards and other composite applications
AJAX enables mixing and matching of multiple component technologies within the same application. This enables AJAX developers to build composite applications that leverage best-of-breed AJAX technologies from multiple suppliers, achieving many different types of composite applications, such as:
- Mashups - A mashup is a Web site or Web application that uses content from more than one source to create a completely new service. One concrete example is a custom mapping application that talks to a company's own server to pull down XML address data and then leverages mapping services (e.g., Google or Yahoo) to show a map view in combination in an application-specific custom user interface. Mashups often enable rapid application development by integrating ready-made third-party components.
- Portals and dashboards - Portals and dashboard applications consist of multiple panes that often can be configured by the user. Often, each pane is a separate application. AJAX technologies can be used to manage the entire composite application and its integrated applications.
- Service compositions - In an SOA environment, composite business applications assemble multiple application services to create new functionality that supports innovative business processes. In some cases, the services from which the new application is composed have no user interface, so the composite application is completely responsible for the user interface. In other cases the services do have user interfaces, so that the composite application knits together not only back-end behavior components, but user interface components as well.
AJAX also enables collaborative applications, such as:
- Next-generation chat and instant messaging (IM) - AJAX enables Web-based messaging applications that run in the browser.
- Web meetings and whiteboarding - AJAX's rich user interface, network programming, and vector graphics features provide the infrastructure for browser-based Web meetings and shared whiteboards.
- Collaborative content creation - Web-based collaborative applications such as wikis can transition from users having to learn arcane wiki markup languages to a WYSIWYG user experiences, comparable to what users experience today with desktop content creation tools.
- Trip planning - A social group can use an AJAX-powered application to work together to plan and schedule their activities.
- Photo sharing - AJAX enables richer sharing of experiences, such as attaching annotations, tagging or marking up photos.
Collaboration capabilities are based on XMLHttpRequest and other network communications technologies.
An important new application area is the AJAX-powered wiki, where wikis go beyond text-based collaborative documents into the following scenarios:
Cross-device applications (desktop and mobile)
- Rich, lightweight portals AJAX-powered wikis enables fast deployment of Enterprise rich dashboards by allowing a wiki page to contain both text content and AJAX-powered user interface components, such as data grids, forms fillout, mapping, and charting.
- Personal mashups and dashboards Many leading Internet companies provide the option today for customized home pages. When personalization is paired with AJAX-powered components and wiki back-end services, IT gains easy deployment and end-users gain the ability to manage their view on information.
AJAX offers multiple approaches to achieving cross-device applications. This includes:
- Using a mobile subset of AJAX - The W3C and the Open Mobile Alliance (OMA) are working together to standardize appropriate mobile subsets of XHTML, SVG, CSS and ECMAScript to take into account the constraints of today's mobile devices, and combine them together to form a mobile standard for rich content using AJAX.
AJAX offers great promise, but challenges remain before AJAX can realize its full potential and deliver the benefits of Web 2.0. The OpenAjax Alliance has been established to address those challenges and accelerate industry success with AJAX-powered, next-generation rich applications. Target applications include replacements for desktop applications, SOA applications, composite applications, collaboration tools, next-generation wikis and cross-device applications.