AJAXWORLD 2007 EAST: LASZLO UNVEILS LASZLO WEBTOP
Upcoming SlideShare
Loading in...5
×
 

AJAXWORLD 2007 EAST: LASZLO UNVEILS LASZLO WEBTOP

on

  • 4,418 views

 

Statistics

Views

Total Views
4,418
Views on SlideShare
4,418
Embed Views
0

Actions

Likes
0
Downloads
11
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

AJAXWORLD 2007 EAST: LASZLO UNVEILS LASZLO WEBTOP AJAXWORLD 2007 EAST: LASZLO UNVEILS LASZLO WEBTOP Document Transcript

  • AJAXWORLD 2007 EAST: LASZLO UNVEILS LASZLO WEBTOP
  • Facing a few barriers on the road to SOA? JackBe’s Rich Enterprise Application (REA) platform clears the road to SOA business benefits. There’s an abundance of products and vendors to help you create your SOA. Now, consume those SOA services with JackBe REAs to achieve the business productivity and results that led you to SOA in the first place. Our new REA platform combines the power of Ajax and SOA with reliable, secure communications to extend your SOA directly into powerful business applications. A fully visual IDE reduces manual coding and accelerates the development process. And our lightweight, vendor-neutral platform easily integrates with existing middleware and services while maintaining server-side governance and control--unlike products that leave governance to the browser or create middleware platform dependencies. Join over 35 industry leaders like Citigroup, the U.S. Defense Intelligence Agency, Sears, Tupperware, and Forbes who are already optimizing their business activity with JackBe solutions. Call or visit our website—let us help you remove the barriers on the road to achieving real business value from your SOA investment. Web: www.jackbe.com Phone: (240) 744-7620 Optimizing Business Activity Email: info@jackbe.com
  • March 2007 n6 The AJAX Story Is n20 Exposing and Preventing Still Just Beginning Errors in AJAX Applications From The Editor Using a quality infrastrucure by Dion Hinchcliffe by Nathan Jakubiak n24 The Big Shift n8 On-Demand Is in Demand AJAX and Web Service Bus architectures Advances in programming make SaaS enable the shift from request and response a viable option for SMBs to message and event-driven application architectures by Victor Pinenkov by Kevin Hakman n10 Mashups & Semantic n32 Automatically Testing AJAX Mashups The value of RDF: Taking the Web User Interfaces The reason for automating to the next step user interface tests by Dean Allemang by Reginald Stadlbauer n14 AJAX, Where Design n38 Struts Portlets with Meets Code AJAX in Action Challenges faced during implementation The beginning of a new Web experience by Kris Vishwanathan by Kris Hadlock n44 How Web 2.0 Makes Business Intelligence Smarter n16 Building the Data Web And what corporate IT needs to do A call for a data syndication standard to implement such solutions by Ric Hardacre Langdon White AJAx.SyS-coN.coM March 2007 
  • From The Editor The AJAX Group Publisher Jeremy Geelan Art Director Louis F. Cuffari Editorial Story Is Still Editor-in-chief Dion Hinchcliffe Dion Hinchcliffe dion@sys-con.com Just Beginning Editor Nancy Valentine, 201 802-3044 nancy@sys-con.com To submit a proposal for an article, go to T http://grids.sys-con.com/proposal. he conjunction of AJAXWorld in New York City. Many are addressed too Subscriptions Conference & Expo 2007 this month in Real-World AJAX, but many remain rela- E-mail: subscribe@sys-con.com with the publication of the 600- tively unanswered in an industry strug- U.S. Toll Free: 888 303-5282 page blockbuster Real-World AJAX, the gling to deal with a major mid-industry International: 201 802-3012 Fax: 201 782-9600 announcement by the OpenAjax Alliance change. The tools, processes, and tech- Cover Price U.S. $5.99 of the OpenAjax Hub and OpenAjax nologies we’ve brought to bear to build U.S. $19.99 (12 issues/1 year) Conformance, the release by Laszlo Web applications are going to change a Canada/Mexico: $29.99/year Systems of OpenLaszlo 4.0 and the Laszlo lot, as well as the skill sets. These types International: $39.99/year Credit Card, U.S. Banks Webtop...all these thing coming together of rich Web applications require serious or Money Orders at once mark a significant milestone in the software development skills, particularly Back Issues: $12/each brief history of AJAX, rich user experiences as the browser is a relatively constrained in general, and the growing challenges and environment compared to traditional soft- Editorial and Advertising Offices Postmaster: Send all address changes to: opportunities in this space as we continue ware development runtime environments SYS-CON Media to witness a tectonic shift in the way Web like Java and .NET. 577 Chestnut Ridge Road, apps are designed and built. Of course, despite these issues – even Woodcliff Lake, NJ 07677 We are now rapidly leaving the era because of them – it is a very exciting Worldwide Newsstand Distribution where static HTML is acceptable to the time to be in the AJAX business right now. Curtis Circulation Company, users and customers of our software. The One big reason is that there are few AJAX New Milford, NJ “Web page” metaphor is just no longer products with clear market dominance a compelling model for the majority of yet and the dozens and dozens of AJAX List Rental Information online Web applications. libraries and frameworks currently avail- Kevin Collopy: 845 731-2684, kevin.collopy@edithroman.com, Combined with the rise of badges and able offer a very diverse and compelling Frank Cipolla: 845 731-3832, widgets, and the growing prevalence of set of options for use as the foundation of frank.cipolla@epostdirect.com what I call the “Global SOA” to give us vast the next great AJAX application. While the landscapes of incredibly high-value Web Dojo Toolkit is probably the AJAX toolkit Promotional Reprints Megan Mussa services and Web parts, it’s important with the largest mindshare and lots of megan@sys-con.com to note that the use of AJAX is essential industry interest at the present time, the to even start exploiting these important big vendors such as Microsoft and their Copyright © 2007 trends. Skirting the corners of this phe- ASP.NET AJAX (a.k.a. “Atlas”) show, as the by SYS-CON Publications, Inc. All rights reserved. No part of this publication may nomenon are also the non-trivial chal- first major products from big vendors be reproduced or transmitted in any form lenges offered up by largely abandon- make their way to market, that the story or by any means, electronic or mechani- ing the traditional model of the browser. is still just beginning. cal, including photocopy or any informa- Specifically, what happens to search There’s little doubt that we’ll continue tion storage and retrieval system, without written permission. engine optimization (SEO), disabled to see the AJAX market maturing and I’m accessibility, link propagation (along with looking forward to a variety of upcoming AJAXWorld Magazine network effects), Web analytics, tradition- improvement such as Project Tamarin, the is published bimonthly (6 times a year) al Web user interface conventions, and high-speed JavaScript engine donated by by SYS-CON Publications, Inc., more, which are all dramatically affected Adobe to the Mozilla project; the ongoing 577 Chestnut Ridge Road, Woodcliff Lake, NJ 07677. – often broken outright – by the AJAX Web evolution of OpenAjax; and the 1.0 release SYS-CON Media and SYS-CON application model? of Dojo sometime this year; to name just Publications, Inc., reserve the right to Many of these questions will be a few of the exciting things that have the revise, republish, and authorize its answered, for those of you reading this potential to ensure AJAX continues to grow readers to use the articles submitted for publication. issue at AJAXWorld 2007 East, at the event and evolve. n 6 March 2007 AJAx.SyS-coN.coM
  • SAAS On-Demand Is In Demand SYS-CON Media President & CEO Fuat Kircaali, 201 802-3001 fuat@sys-con.com Group Publisher Jeremy Geelan, 201 802-3040 Advances in programming make SaaS a viable option for SMBs jeremy@sys-con.com by Victor Pinenkov M Advertising ost small and medium-sized businesses configure the application across the entire business, Senior Vice President, (SMBs) require the same software capa- setting parameters that meet the company’s particu- Sales & Marketing Carmen Gonzalez, 201 802-3021 bilities as large enterprises but don’t have lar requirements. Customization also allows resellers carmen@sys-con.com the resources and in-house technical expertise neces- and systems integrators to add new fields, create new Vice President, Sales & Marketing sary to manage it themselves. A study by the Cutter interfaces, and integrate data from other software Miles Silverman , 201 802-3029 Consortium finds that many businesses are no longer applications. miles@sys-con.com willing to tolerate the long deployment cycles, ongoing Integration used to be a challenge for SaaS appli- Advertising Sales Director Megan Mussa, 201 802-3028 administrative hassles, high operating costs, and low cations and a deterrent for potential customers who megan@sys-con.com ROI associated with traditional on-premise software. needed the hosted program to integrate with their Sales Manager Consequently, an increasing number of organiza- existing applications, databases, and architectures. Corinna Melcon, 201 802-3026 tions are seeking outsourced and hosted solutions, Advanced integration middleware, service-oriented corinna@sys-con.com which offer comparable levels of functionality at a architectures, and open APIs are making it easier to Events Manager Lauren Orsi, 201 802-3024 fraction of the cost. Now a viable alternative to on- create connections between software systems. Many lauren@sys-con.com premise solutions, Software as a Service (SaaS) adop- SaaS vendors now offer a variety of options, such as file tion is expected to grow over the next several years. and batch transfer, and provide a defined set of pro- Production Research by industry analyst firms shows that the gramming interfaces to make it easier for customers to Lead Designer percentage of business software spending on SaaS integrate their SaaS and on-premise applications. Louis F. Cuffari, 201 802-3035 louis@sys-con.com will grow from 5% in 2005 to 25% in 2011. “The advent of AJAX and other de facto Web-ori- Art Director ented application development standards has helped Alex Botero, 201 802-3031 New Life for Hosted Applications to accelerate the growth of the SaaS market by mak- alex@sys-con.com Application service providers (ASPs), the first ing it easier for users to implement and integrate Associate Art Directors companies to offer software via the Web, hosted on-demand software services,” according to Jeffrey Tami Beatty, 201 802-3038 tami@sys-con.com third-party applications in mini-data centers. The M. Kaplan, managing director of THINKstrategies Abraham Addo, 201 802-3037 large complex software had limited functionality and and founder of the SaaS Showplace ( www.saas-show- abraham@sys-con.com required expensive server installations. place.com). The current crop of SaaS applications operate at A wider array of service options and capabili- SYS-CON.COM higher speeds and have greater capabilities because ties will become available as developers make fur- Consultant, Information Systems Robert Diamond, 201 802-3051 of breakthrough technologies and programming such ther advances in programming technology. Some robert@sys-con.com as Asynchronous JavaScript and XML (AJAX). AJAX experts suggest that an increasing number of SaaS Web Designers programming provides an intelligent and efficient vendors will offer fully functioning offline versions Stephen Kilmurray, 201 802-3053 approach to client/server interaction and enables of their AJAX-based services that synchronize with stephen@sys-con.com automatic changes to content without requiring the a user’s online account when reconnected to the Richard Walter, 201 802-3057 richard@sys-con.com full Web page to reload, allowing users to move rapid- Internet. Kaplan suggests the growth of offline ly between different areas of the application. Software capabilities is a natural market evolution for SaaS Accounting applications end up operating much like familiar solutions. Financial Analyst desktop software and provide similar functionality. SaaS providers will also continue to focus on Joan LaRose, 201 802-3081 For example, the improved interactivity and usability improving security, reliability, and integration capa- joan@sys-con.com Accounts Payable of the applications make it easy to conduct real-time bilities and enhancing features offered to end users. Betty White, 201 802-3002 actions, such as drag-and-drop, grab and scroll, and With its current market penetration and expectations betty@sys-con.com grab and zoom. for growth, it’s apparent that SaaS is asserting its posi- Advances in AJAX and other HTML standards, tion in the software industry – an affordable alterna- Customer Relations open source systems, and the increasing availabil- tive that allows SMBs to break free of costly enterprise Circulation Service Coordinators Edna Earle Russell, 201 802-3081 ity of open application program interfaces (APIs) applications. n edna@sys-con.com have made it possible to develop and enhance SaaS more quickly and less expensively. SaaS providers Victor Pinenkov is vice-president of engineering for BlueTie, Inc. He now have greater customization and configuration is responsible for managing the company’s application development, capabilities. Many solutions enable administrators to software infrastructure, and all IT engineers and staff. 8 March 2007 AJAx.SyS-coN.coM
  • RDF Mashups and Semantic Mashups by Dean Allemang The value of RDF: Taking the Web to the next step I n the early days of the Web, we were thrilled when mate mashup language; it provides a simple way to we could find addresses and phone numbers of express information from spreadsheets, databases, commercial establishments. As more sophisti- Web pages, XML files, and, yes, even native RDF/XML cated Web sites started using databases behind the files, allowing them to be merged into a single graph scenes, we came to expect a page that included all structure. the addresses for each branch of a chain in our city If you have unfettered access to the database or neighborhood. When Mapquest came along, we behind a Web page, you can treat it as RDF using an were delighted that we could click a button and see RDF database wrapper like D2RQ, but since we usu- the location for each of these shops on a map. Then ally want to mash up information from other sources, came the Web 2.0 idea of the mashup; at a click of a and most security administrators don’t provide global single button, we could see all the Starbucks in a zip access to their database, another approach is needed. code all at once. Enter the W3C Working Draft. These mashups are great if you’re looking for one RDFa lets Web site developers make an HTML kind of thing (coffee shops, hotels, gyms) and come page do double duty as a presentation page (the usual from one source (especially when that source is an role of HTML) and as a machine-readable source of amalgamator like Citysearch or even Google). But structured data in RDF. As a simple example, consider suppose you’re moving to an unfamiliar city; you’d the following excerpt from the Los Angeles Metro Rail like to see a map with all the subway stations, gyms, Web page, with a few minor modifications to embed organic supermarkets, art-house movie theaters, and, RDF data in with the HTML display: yes, coffee shops so you can figure out where you’d like to live, preferably each type in a distinctive color <p><font size=”2”><div name=”rlhv” id=”rlhv”> or icon to distinguish it from the others, providing a <link rel=”rdf:type” href=”[LAMetro: real integrated picture of the neighborhood. RedlineStation]”/> There are a couple of ways to do this with com- <meta property=”rdfs:label”>Hollywood/ mon Web 2.0 approaches today. You could do a map Vine</meta> <br/> Dean Allermang is a long-time traveller mashup of each kind of thing you want to see and <a href=”../../about_us/metroart/images/ in knowledge science. He was awared his display all those maps on the screen at once. This gets pict_mrlhv.jpg”>Station Image</a> PhD in AI in 1990, worked at five differ- you the information you need, but you might be at <b><br/> ent AI labs in Europe between 1990-1996, risk of whiplash turning your head so much from one co-founded a company in the mid-90s that map to another. </b><meta property=”geo:address”>6250 tried to invent the Semantic Web when the You could spend some time bookmarking all these Hollywood Bl.<br/> standards were just a gleam in the eye of things in your favorite mapping application so that Los Angeles 90038 <br/></meta> a few W3C folks, and is now working as a they’re all on a single map. But the idea of a mashup 60 Park/Ride Lot Spaces (Parking Fee)<br/> consultant for TopQuadrant Inc. as their is that the information should be available from feeds <a href=”../../projects_plans/bikeway_plan- Semantic Web expert. Though he is the one – like the RSS feeds we’ve become familiar with for ning/images/bike_rack_mrhv.jpg”>18 running the training course, he learns more our news. That way, whenever Starbucks opens a Bike Rack Spaces</a></div></font></p> from the students than they ever guess. His new shop or a neighborhood announces an open- laptop is full of semantic web software, and studios event or another real estate listing is posted, The extra <div …>, <link … >, and <meta …> tags he even knows how to use more than half of your mashup will update with it. When we can merge mark up the HTML page to include a few simple facts; it. “It’s an exciting time,” says Allerman, “for information from multiple feeds and organize the something called “rlhv” has type “RedlineStation,” those of us who have been fans of abstrac- results – that’s what we call a Semantic Mashup. label “Hollywood/Vine,” and the address “6250 tion for the past three decades.” The first step is to turn all of your data sources Hollywood Bl. Los Angeles 90038.” Most of this infor- dallemang@topquadrant.com into feeds that can be mashed up. RDF is the ulti- mation was already available in the Web page (includ- 10 March 2007 AJAx.SyS-coN.coM
  • ing the name “rlhv”!); the markup just links it together </owl:Class> in a consistent way. The extra markup makes no dif- <owl:Class rdf:about=”#LAMetro”> ference to HTML viewers (like the browser); the page <rdfs:subClassOf rdf:resource=”#LALocale”/> displays in the same way. </owl:Class> The Web Ontology Language was built on top <owl:Class rdf:about=”#Fitness”> of RDF to let us describe how we want to combine <rdfs:subClassOf rdf:resource=”#LALocale”/> information from multiple sources together. Types </owl:Class> in RDF (like “RedlineStation,” in this example) are <owl:Class rdf:ID=”GoldLineStation”> called Classes in OWL, and typed individuals (like <rdfs:subClassOf rdf:resource=”#LAMetro”/> “rlhv” above) are members of one or more classes. </owl:Class> Information from different sources will have different <owl:Class rdf:ID=”GreenLineStation”> types, and so appear as members of different classes; <rdfs:subClassOf rdf:resource=”#LAMetro”/> the Red Line page describes members of the class </owl:Class> RedLineStation, the Blue Line page describes mem- <owl:Class rdf:ID=”BlueLineStation”> bers of the class BlueLineStation, and so on. We define <rdfs:subClassOf rdf:resource=”#LAMetro”/> Figure 1: Class hierarchy for a new class for anything else we can find, a class for </owl:Class> places in Los Angeles, gyms, amusement parks, organic supermarkets. <owl:Class rdf:ID=”RedLineStation”> displayed in Now we can use OWL to describe how we want to <rdfs:subClassOf rdf:resource=”#LAMetro”/> TopBraid Composer. combine these things together. If we want to combine </owl:Class> information about all the metro lines, we define a new <owl:Class rdf:ID=”Cinema”> class in OWL called LAMetroStation and make each of <rdfs:subClassOf rdf:resource=”#Entertainment”/> the line classes (BluelineStation, RedlineStation, etc.) </owl:Class> subclasses of it. We can do the same for any other <owl:Class rdf:ID=”Gym”> classes we’ve defined for gyms, amusement parks, <rdfs:subClassOf rdf:resource=”#Fitness”/> organic supermarkets, whatever. We can express this </owl:Class> class/subclass structure in RDF/XML as follows: <owl:Class rdf:ID=”Pool”> <rdfs:subClassOf rdf:resource=”#Fitness”/> <owl:Class rdf:about=”#LALocale”/> </owl:Class> <owl:Class rdf:about=”#Entertainment”> <owl:Class rdf:ID=”Yoga”> <rdfs:subClassOf rdf:resource=”#LALocale”/> <rdfs:subClassOf rdf:resource=”#Fitness”/> Figure 2: Places of various types (metro station, amusement park, etc.) shown on a single google map. AJAx.SyS-coN.coM March 2007 11
  • </owl:Class> You can display your mashup to include information <owl:Class rdf:ID=”AmusementPark”> at any level of the tree. <rdfs:subClassOf rdf:resource=”#Entertainment”/> But OWL goes far beyond simply amalgamat- </owl:Class> ing information through subclasses; you can also <owl:Class rdf:ID=”Theater”> specify constraints on your information. For exam- <rdfs:subClassOf rdf:resource=”#Entertainment”/> ple, we could say something like “All members of </owl:Class> BlueLineStation are restricted to have http://www. <owl:Class rdf:ID=”ConcertHall”> topquadrant.com/images/icons/bluetrain.gif as an <rdfs:subClassOf rdf:resource=”#Entertainment”/> icon.” In OWL/RDF this looks like: </owl:Class> <owl:Class rdf:about=”#BlueLineStation”> This is easier to see in outline form (as shown in <rdfs:subClassOf> an RDF visualization tool like TopBraid Composer, see <owl:Restriction> Figure 1). <owl:hasValue>http://www.topquadrant.com/imag- The meaning of subClassOf in OWL is very simple; es/icons/bluetrain.gif</owl:hasValue> it just means that all the members of BlueLineStation, <owl:onProperty rdf:resource=”http://www. RedLineStation, etc. are also members of LAMetro, topquadrant.com/maps/mapModel.owl#hasIcon”/> and that all the members of LAMetro, Fitness, or <rdfs:subClassOf> Entertainment in turn are members of the top class, </owl:Class> LALocale. So to display all the metro stations, you just query for members of LAMetro; to display all the When we do the same for the other classes (redtrain.gif places of interest in L.A., you query for members of for RedLineStation, ferriswheel.gif for AmusementPark), LALocale. Send the results off to a display API like this lets OWL set icons according to the class an instance GoogleMaps and you get a screenshot, that looks like belongs to. We send that to the mapping API as before, Figure 2. and we get a map with different kinds of places indicated Just as class structures in object-oriented pro- by appropriate icons, as shown in Figure 3. gramming help you to organize your program code, This same approach can be used to customize class structures in OWL let you organize your data. any part of the mashup that the API can handle, what Figure 3: Each type of place from Figure 2 is shown with a different icon; colored icons for each metro line, ferris wheels for amusement parks, etc. 12 March 2007 AJAx.SyS-coN.coM
  • Advertising Index information appears when you hover over an icon or Advertiser URL Phone Page Adobe www.adobe.com 23 what URL you visit when you click through a bubble. Backbase www.backbase.com 866-800-8996 47 There’s no reason to limit this kind of mashup to Cynergy Systems www.cynergysystems.com 50,51 maps; the same approach works just as we ll for any way Etelos ajaxworld.etelos.com 37 you might want to display data, calendars, spreadsheets, Google www.google.com/jobs/ 31 helmi technologies www.helmitechnologies.com 41 org charts, pie charts, and PERT charts. There’s not ICEsoft www.icesoft.com 1-877-263-3822 21 even any reason to limit your mashup to a single one of JackBe www.jackbe.com 240-744-7620 4 these modes; after all, concert halls have performance JetBrains www.jetbrains.com/idea 27 schedules, train stations have timetables, and people Kapow technologies www.kapowtech.com 43 Laszlo Systems www.laszlosystems.com 2,3 in your organization attend meetings that take place at Nexaweb www.nexaweb.com 7 particular places and times. OWL provides a wide range ORACLE oracle.com/middleware 1-800-ORACLE1 9 of modeling capabilities that let you combine informa- Parasoft www.parasoft.com 888-305-0041 35 Quasar Technologies www.quasar-tech.com 29 tion from multiple sources in your filters. Following the Servoy www.servoy.com 805-624-4959 45 map example, display the location of all the amusement Sun Microsystems sun.com/startup 13 parks, but use a special icon for the ones you’ve visited, telerik www.telerik.com/radajax 52 and put the date you visited them on the hover label. Advertiser index is provided as an additional service to our readers. Publisher does not assume any liability for ommissions and/or misprints in this listing since this listing is not part of any insertion order. This paints a pretty rosy picture of how you can build powerful semantic mashups with standards-compliant, readily available tools. But there’s a bit of rain on this parade of exhibitionists. The only reason their data is on the – a pre-requisite for all this mashing up is that the data be Web in the first place is to show it off. And the more available in RDF – and who wants to do all that work? My people who have their data available in RDF, the more data is in a database, or a spreadsheet, or HTML, or XML, valuable it is to have your data available that way too or… Do I have to transfer it to yet another format? And for semantic mashups like the ones we describe here. especially RDFa – who’s going to do all that marking up just This is the sort of network effect that brought the Web to make their data easier for other people to use? into being. TopQuadrant is doing its part to start this Well, fortunately for semantic mashups (and bootstrap by providing semantic mashup tools; you indeed, fortunately for the Web, since this is how the can get in the game by making your own data avail- Web came into being in the first place), the Web is full able in RDF. n © 2007 Sun Microsystems, Inc. All rights reserved. Jumpstart your Startup. Get enterprise-grade products at ridiculously low prices, free world-class software and expertise to get you up and running fast. Visit sun.com/startup.
  • Design AJAX, Where Design by Kris Hadlock Meets Code T ime and again I’ve seen applications fail Coding an Experience because of an unusable interface design. This The whole purpose behind using AJAX is centered not only includes the look-and-feel of the on the idea of creating a better user experience, one application, but the actual interaction processes that in which users don’t have to wait for pages to load, it contains. I know many people who immediately allowing them to get information on demand and leave a Web site if it does not look appealing or func- achieve what they set out to do with an application. tion simply from the start. It doesn’t matter whether Although AJAX requires development skills to cre- the application could have helped them accomplish a ate the complex server-side requests and front-end goal, it simply doesn’t stand a chance without usable interactions, the learning curve is truly not very steep design and functionality. Simply put, if an application and any designers with the motivation and drive can doesn’t look usable it’s not usable. easily find resources or wrappers to help them imple- There are far too many options on the Web today, ment an AJAX solution. Aside from a good idea a suc- leaving no time for discovery. People want information cessful AJAX application relies heavily on the design immediately and they will get it elsewhere if an appli- and interaction processes it implements. To create a cation doesn’t provide it. This is one of many reasons successful AJAX application the code shouldn’t just why the primary focus during application develop- be solid and written well, its primary focus should ment should be on the design of the application and be keeping itself invisible to the user and focusing on the code should be used to accomplish those design what occurs at the front-end. goals. Although design is largely based on what some- Until recently desktop applications were the way to thing looks like, Web application design is also based provide complex possibilities to users. With browsers on how interactions flow and how a user interacts with adopting more standards the Web is becoming a new that design to accomplish a goal. The code should be realm of experience capable of providing powerful func- focused on making the interface more usable, the tasks tionality that rivals the desktop. The Web not only pro- easier to understand and so easier to accomplish. vides information to the user, it lets users provide infor- AJAX offers solutions to this problem by keeping mation to the Web. We’re experiencing the beginning of the design tightly integrated with the code. As an AJAX a new Web experience that lets users interact with infor- developer it’s impossible not to consider how the code mation, collaborate, and really immerse themselves in relates to the interface because the request/response the information they want. AJAX simply provides a new model that it creates requires knowledge of how to platform that lets users achieve this possibility. parse and display the data to the user, how to interact with the server from the front-end, and how to use Tech Talk code to stylize the end results. AJAX is replacing the AJAX relies on the request model inherent in the disjointed user experiences of the past with cohesive xmlhttprequest object, but is made accessible to the applications that require that design and code work user by the integration of JavaScript, CSS, and (X)HTML Kris Hadlock is the author of AJAX for Web together. AJAX makes the right features of an applica- and its combined creation of DHTML. All three of these Application Developers (Sams, October 2006) tion more responsive and keeps the attention of the technologies produce the graphical user interface or and a featured columnist and writer for numer- user where it counts. Web 2.0 relies on these concepts; GUI. The GUI is where the user views and interacts with ous Web sites and design magazines. He is also although not new to some, the Web is finally becom- an application. In an application that implements AJAX, the founder of Studio Sedition, a Web develop- ing a reliable destination for implementing them. the GUI and the server share a common bond through ment firm, the co-founder of 33Inc alongside AJAX has existed for years now, but many browsers XML. With AJAX, XML is the glue that ties design with partner Robert Hoekman, Jr., and maintains a didn’t support the technologies that produce this code and produces a process like no other. The process blog called Designing with Code. You can find functionality. Now we’re in the presence of Web 2.0 begins with an interaction made by the user. The inter- all of the above and more about Kris at where design and code are integrated to produce Web action produces a request that’s made to the server, the www.krishadlock.com applications of a new breed. server responds with static or dynamic XML. JavaScript 14 March 2007 AJAx.SyS-coN.coM
  • gets the response and handles displaying it to the user. are made, what server-side processes occur, and how the CSS is used to stylize the elements in the interface and responses are parsed and displayed. A developer who the (X)HTML is used to display the data to the user in uses this approach has to understand how the data relates the presentation defined by CSS. The figure below shows to the user and server and how to integrate the two seam- the layers of an AJAX application and how the GUI and lessly to create an exclusive experience. This approach server work closely to integrate design with code. can also teach developers techniques they wouldn’t have The GUI and the server work in cohesion to produce the learned otherwise. Most often programmers don’t touch results necessary for a successful application. AJAX integrates the GUI and GUI designers don’t touch the back-end, but the front- and back-end by letting them communicate with- AJAX requires both to interact so closely that it’s impos- out reloading the page. Complex data exchanges can occur sible not to use both unless a team of developers and without interrupting the experience. Exchanges such as designers are involved. Ultimately an application’s focus saving, retrieving, updating, or deleting data from a database should be on how to leverage both sides to create a more are possible just as with the standard HTTP request model. usable experience. There are many different options when deciding how to approach an AJAX application, let’s focus on a couple that The Right Place at the Right Time leverage the full capabilities of an AJAX experience. As with any technology, AJAX isn’t always the best solution to a problem. Using it at the right place at the Approaches right time is crucial to its purpose. As always, when plan- When developing AJAX applications there are a ning an application, the right blend of technologies is number of ways to approach the creation of an appli- imperative to the purpose and overall goal of the appli- cation. You can build one from scratch, choose from cation. AJAX is rarely necessary for an entire application one of the many existing libraries and frameworks, or and should be used for more specific features, features integrate these options to create a hybrid. that would benefit in some way from using this group Creating an application from scratch requires that the of technologies. It’s rare that any one technology is right developer know both the client- and server-side technol- for an entire application, as was discovered with Flash in ogies, or two tightly knit teams. AJAX creates a bridge that the not so distant past. Most developers learned that it’s allows closer collaboration between programming and more beneficial to use extremely interactive technolo- design teams. To a single developer this approach pro- gies in smaller doses where it counts. This automatically vides much more power because it requires a complete draws more attention to those areas of the application understanding of the application, such as how requests and provides the user with focus. n Graphical User Interface (X)HTML The combination of these front- end technologies is DHTML. This is where the user views and interacts CSS with an application. This is also the location where Ajax requests are made and responses are received then displayed to the user. JavaScript XML Server-side language Server Figure 1: AJAx.SyS-coN.coM March 2007 1
  • RSS Building the Data Web by Ric Hardacre A call for a data syndication standard T he Web is full of data: statistics, surveys, and the Web 2.0 age and should not be overlooked. Before reports can be found on almost any topic you there were JavaScript APIs coming out of the wood- care to search for. It’s this very fact that makes work there were RSS aggregators that built virtual Web the Web the first stop in anyone’s research. Want to sites out of the parts of other Web sites. know the average number of petals on a daisy? Thirty- Now let’s consider the most seen AJAX powered four. The number of species of whale? Eighty (or mashup: modifications of map sites, adding real thereabouts, depending on your definition of “whale” estate pictures and locations to a map, for example. apparently). This sort of thing would be made a lot easier and Of course one could spend all day typing random accessible if the real estate agents published an RSS- questions into a search engine but the serious busi- like feed of properties, along with their GPS coor- ness of research lies in statistical analysis, comparing dinates and prices. Even in this limited scope the datasets for trends. One obvious example is compar- possibilities are endless, a burger chain could publish ing the performance of various stock markets around the locations of its restaurants, or news bulletins the globe over time, this happens so frequently that could come attached with markers. Planes, trains, and it’s quite a simple task online. So is comparing curren- – well, possibly – automobiles could be tracked and cy’s performances against each other. But what if you tacked onto maps. Want to see where the roadworks wanted to do both? What if you wanted to compare are on your journey? Just import the official highway’s the yen against the London Stock Exchange’s closing feed of roadworks into any mapping site or software index? At first glance that might seem like a nonsensi- of your choosing. cal comparison but in financial research trends are This problem has already been solved to a certain key and trends can’t be found without comparing extent of course with Google Earth, but the scope is datasets, no matter how far and wide. limited by its narrow focus, purely on coordinates. Unfortunately most, if not all, of the data on the Wouldn’t it be great if a feed could contain not only Web is embedded in Web pages, and most often only property locations and prices, but that your browser presented in graphical form. There’s just no way of could detect the presence of both. The browser itself looking at a chart of something over time and reliably would then let you tack them onto a map, or sort by viewing the corresponding data, at least, not across price in a spreadsheet. This too has limits. I doubt the board. “number of bedrooms” could be generalized into a Now let’s step back a moment and look at another universal datatype, but price (currency=”USD”) and existing Web technology: RSS (or ATOM if you are so coordinates (type=”GPS”) are easily comparable and inclined). Really Simple Syndication is a way for Web transposable across differing datasets. The next step sites to publish a simplified list of links to articles and would be to merge the property and burger chain items on their sites. So instead of logging into a news feeds, selecting only those houses within x miles of site every day to check for new items you “subscribe” the nearest drive-thru. to an RSS feed and just check the feed. What made So let’s get back to our original data problem, this possible was a simple, standard, open format that this time suppose I want to compare the popula- Ric Hardacre discovered the Web in the mid was easy both to create and read by both humans and tions of London, New York, and Tokyo over the past ‘90s when he really should have been at computers. century. Sounds simple enough and a few minutes lectures and not in the University computer Over the past few years RSS has caught on in a of Web searching yielded a handy “Inner London” lab. He’s since worked as a Web solutions big way, it’s simple to write your own RSS parser and set of census data I could use, which was encourag- developer, systems architect, and wireless create a news ticker that watches your favorite Web ing. However, New York took a few minutes longer and satellite network specialist. His current sites, for example. Browser plug-ins have given way before it too yielded data. Tokyo proved too stubborn day job is as an MCP C# Developer in the to native support and suddenly the Web started to however and I gave up, having only managed to get UK. ric.hardacre@cyclomedia.co.uk feel just that little bit more integrated. RSS foretold data for a handful of random years; 2000, 2003, and 16 March 2007 AJAx.SyS-coN.coM
  • 1960, hardly an extensive dataset. I got relatively good <col title=”Population” format=”0” /> data for London and New York, one set of figures </head> for each decade. One, however, was embedded in a <body> HTML table and the other in a text file, formatted and <tr><td>1901</td><td>6506889</td></tr> aligned using spaces. <tr><td>1911</td><td>7160441</td></tr> The next step is to copy and paste each snippet <tr><td>1921</td><td>7386755</td></tr> of data cell by cell into a spreadsheet and finally run <tr><td>1931</td><td>8110358</td></tr> the graph wizard. Finally you can behold the wonder <tr><td>1941</td><td note=”Estimate”>8160000</td></ as Inner London’s population stays essentially still tr> while New York’s stealthily overtakes it. Now I could <tr><td>1951</td><td>8196807</td></tr> be accused at this point of serial laziness, but it just <tr><td>1961</td><td>7992443</td></tr> seems like a lot of work, especially the extensive <tr><td>1971</td><td>7368693</td></tr> search engine hammering. Suppose that each site <tr><td>1981</td><td>6608598</td></tr> had published a standard formatted set of data, and <tr><td>1991</td><td>6679699</td></tr> I could run a dataset search to pull it back. Then an <tr><td>2001</td><td>7172036</td></tr> aggregator could look at the data and splice it togeth- </body> er. Sounds farfetched, but is it really? </dataset> Let’s now pull RSS back into this discussion, sup- pose we apply a similar principle to this data too. Basically what we have here is a combination of First, give the dataset a header including its title and technologies, the XML is designed to reflect RSS and source then add each column of data with a strict set bear more than a passing resemblance to an HTML of criteria for defining its type and formatting. This table. In the latter case it means that any program- way a piece of aggregator software would look at our mer familiar with browser DOM scripting can easily population sets and see two columns in eac h, one for parse this too. It takes a different approach to a SOAP the year and one for the population. Population is just dataset in that the datatypes and column names are a number and at the behest of trying to keep it simple listed in a header block while the data table structure our columns could probably be just “year” and “num- is fixed. It’s also more lightweight than a serialized ber,” leaving it up to the column title to belie what the recordset but still contains the important details number count is, well, counting. about the data we’re publishing. Next the aggregator would look across the datasets Because it’s a straight table with defined columns and recognizing that both have a major axis of “year” we can use it to publish serial data, as above, or dis- instantly know that they can be combined, even if the creet data, such as the list of burger restaurants and years don’t match exactly (British population counts their locations. Finally, because it’s simple XML it’s are done on years ending in 1, not 0 for example). extensible, rows, or cells could have individual notes Provided the definition of “year” is fixed and the num- attached. Indeed, notice that in 1941 World War II was bers representing the year are always four-digit then going on so we only have an estimate to work with. there can never be any ambiguity between different Suddenly comparing global temperature to the datasets. numbers of sea-borne pirates over time becomes so Now the aggregator would see that both have a much easier – and though I’m only speculating out second column of number, but even though it doesn’t loud here, I for one would welcome such a standard. know what the number pertains to it would notice Imagine what this would do for business practice that their lowest and highest values fall into a similar in general, and democracy at large. If the de facto range, hardly rocket science. The result is the ability to standard of openness was to publish on one’s Web graph them both together. Even if we were comparing site a syndication of data: incomes, expenditure, tax, two datasets with differing second columns then, like contracts – all there for the public to parse, analyze, we do manually, we would overlay them both scaled and compare in the click of a button. to facilitate easy comparison with a label to say what Wait a minute, I hear you say, what about ODF units each are in. spreadsheets? Yes, they’re open, standard, and And here’s a crude example, thrown together in already XML formatted. But suggesting that a data minutes: syndication format would be pointless if you could already download and open a spreadsheet in a <?xml version=”1.0” encoding=”utf-8” ?> spreadsheet application is the same as asking of RSS: <dataset title=”Census Population of Inner London Why not just visit the Web site and check for new 1901-2001” key=”year”> news items yourself? So ask yourself this instead: <head cols=”2”> If that had remained the attitude for all this time, <col id=”year” title=”Year” format=”yyyy” /> would we have a Web 2.0? n AJAx.SyS-coN.coM March 2007 17
  • Tests Exposing and Preventing by Nathan Jakubiak Errors in AJAX Applications Using a quality infrastructure W hen organizations focus on exposing Web Services, client-side JavaScript engine, and errors in any kind of application, they different browsers with different JavaScript/DOM traditionally focus on testing. Once an implementations, just to name a few. Logic no application is finished, it’s passed to a QA team to find longer resides only on the server, but also in cli- and report problems. There’s some back and forth as ent-side JavaScript. Figure 1 shows the aspects of the QA team reports problems, development fixes a typical AJAX application on which I focus in this them, QA retests the application, and so on. Once that article. cycle has been repeated a few times (if there’s time 2. The user interface is put together bit by bit – it for that), the application is released. This approach consists of an initial HTML layout, followed by is problematic, however. The quality of the applica- inserted data from asynchronous server requests, tion is assessed at the end of the project. By that time, all constructed using a JavaScript engine to pro- incorrectly implemented requirements or bugs may duce the finished result. be firmly planted in the application and have features 3. Because Web applications are delivered through built on top of them, and addressing the problems browsers, and browsers have different JavaScript/ can be very difficult and time-consuming, if not DOM implementations, it’s crucial to test the Web impossible. With no way to determine whether the application against different browser types and quality objectives are actually being met throughout versions. This can be time-consuming and tedious the development process, it’s impossible to deliver a if it’s not automated. truly quality application. Another issue unique to Web applications that Because of these complexities, AJAX applications deliver critical business needs is that many of them require specific ways of ensuring their quality. In this are in a continual “beta”state. There’s no time for a article, I’ll focus on what it means to define a quality traditional development cycle where requirements infrastructure, and I’ll also explain what that looks like are defined and the application is then architected, in detail for an AJAX application. built, tested, and released. Features are put into the application as quickly as possible because they affect Defining and Enforcing the bottom line. Since there’s no time for heavily Development Best Practices investing in the design of a new feature, it’s quickly The first step in building a quality infrastructure added as a “trial”; if the feature doesn’t meet the needs is defining quality at the beginning – with devel- of the customer, it can be removed just as quickly. This opers. This means defining the development best means that many Web applications are in a continual practices that are going to be followed to ensure that state of flux; there’s never a finishing point. Features when the application is ready for deployment, it has are simply added one or two at a time, on demand, as been developed correctly the entire time. You may they’re needed. Without being able to take any signifi- not think that this is important, but consider this: the cant amount of time for testing, how do you ensure quality of the code base for your Web applications Nathan Jakubiak is a software engineer the quality of the application? directly influences your organization’s bottom line. at Parasoft. He currently manages the The answer to ensuring quality lies in creating a If the application works properly, more customers development of Parasoft WebKing and is quality infrastructure that enables an organization to use your services; if it doesn’t, they may never return. the lead developer of Parasoft’s AJAX testing establish quality through all stages of development. Functional and other kinds of tests are crucial to vali- solution. Nathan has extensive experience However, in the case of AJAX applications, the follow- dating the quality of your application; however, test- developing testing tools for Web-based ing challenges arise: ing finds errors after they’ve been introduced. Many technologies and has a number of pending 1. AJAX applications are very complex. A large num- errors can be prevented simply by identifying them in patents in the area of automated ber of components make up the application such your source code as soon as they’ve been added. regression testing. as application server, database server, back-end One source of best practices that you should 18 March 2007 AJAx.SyS-coN.coM
  • adopt is common industry best practices for own custom browser-agnostic JavaScript methods are how code should be written to prevent errors. being called instead of browser-specific methods that Conventional wisdom exists regarding the best could break your application in some browsers. way to write code in different languages to solve Use an enforcement tool that automatically checks for different problems. Any given project may not syntax problems besides having built-in rules to look benefit from all the coding best practices that exist, for common JavaScript coding mistakes or browser but every project can benefit from some subset of incompatibility issues. The enforcement tool should them. also let you easily define your own internal best In addition, your organization may have defined practices guidelines and automatically enforce them. its own internal standards for ensuring that applica- Examples of some custom guidelines you might cre- tions are written properly. Most development groups ate and enforce: already have these kinds of best practices defined, 1. Every method or variable must be defined in a either formally or informally. However, defining them namespace is only part of the solution – you must also enforce 2. Use your own NodeCreator.createNode() method these best practices. instead of the standard DOM methods for creating Best practices do no good unless they’re followed. nodes to handle browser inconsistencies. You’ll get pushback from developers here. I know because I am one. Developers don’t like being told Security Policies how to write code. However, if the infrastructure Security issues are more important for AJAX appli- is defined in such a way that best practices can be cations than for traditional Web applications. There enforced and followed painlessly, developers can are two reasons for this. First, the application logic easily adapt. Enforcing best practices means using that now resides on the client in the form of JavaScript some means (either open source or from a vendor) exposes more of the guts of the application to would- of validating the code on a regular basis to ensure be hackers, making it easier to determine how to that best practices are being followed. Each devel- attack the application. Second, the automatic page oper should be able to run best practices validation update mechanisms of many AJAX applications pro- on his code before checking it in. There should also vide more opportunities for cross-site scripting kinds be a nightly process running against the entire code of exploits. base that identifies violations and which developer However, the methodologies for preventing securi- is responsible for them, and sends a report to that ty flaws haven’t changed. You should take a two-phased person so that he can fix them. This handles cases approach. The first phase is to define a security policy where the developer forgot (or refused) to check that specifies how code should be written to ensure his code before he checked it into the source code security. A policy might specify things such as: repository. 1. Call a custom method you’ve defined called clean- Input() on any client input to the Web application Development Best Practices to remove malicious input for AJAX Applications 2. For Java applications, use the class Prepared- The following best practices should be enforced Statement for all DB queries to prevent SQL injec- for AJAX applications: tion exploits JavaScript The second phase should involve functional vali- If you’re not using a server-side AJAX frame- dation that the security policy is being followed. I work, your application is likely heavily dependent discuss this below. With a well-defined security policy, on JavaScript. It ‘s much easier to introduce errors this two-phased approach should let you build secu- into JavaScript code than into a compiled language rity into your application. because there is no compile-time check for errors. Hence syntax checking is important for JavaScript Application Source Code code. JavaScript’s language features promote bad Your application probably uses a range of tech- programming practices that can make it difficult nologies and languages, including but not limited to manage and reuse a JavaScript code base – for to CSS, HTML, JSP JSF, Java, ASP .NET, PHP etc. All , , example, it’s very easy to add global variables and source code should be validated using a set of best methods. So it’s important to eliminate these kinds of practices to ensure maintainability and reliability. As problems by continually validating that coding best with JavaScript, you should use an automated tool practices are being followed. Browser compatibility to enforce the best practices that meet the goals is a huge issue for AJAX applications. It’s critical to and needs of your Web application. The tool should ensure that your developers aren’t using browser- have built-in best practice enforcement as well as specific JavaScript (and CSS) features, and that your allow you to define your own internal best practices. AJAx.SyS-coN.coM March 2007 19
  • Application Server Output Creating a Nightly Build/Test Code that’s delivered to the browser from the server Infrastructure is often the result of an application server processing Creating a nightly build/test infrastructure is the sec- server-side code (JSP JSF and ASP for example) and , , , ond major step in building the overall quality infrastruc- outputting HTML, JS, etc. As a result, it’s often impor- ture. At Parasoft we’re continually amazed at how many tant to validate the server output once it reaches the organizations don’t do a nightly build. Without a nightly client, since there’s no physical representation of the build, how can you be sure that your current code base “page” on the server. For AJAX applications, HTML even compiles? Or runs properly? Without a nightly build, code often needs to contain certain elements (div errors introduced into the application can exist for a long or span tags, for example) onto which AJAX libraries time before they’re detected. So, a nightly build is a crucial attach the user interface controls that they define. component of the quality infrastructure. The nightly build Validating that such essential elements exist is impor- must be easily repeatable (meaning it can be run without tant in ensuring that developers don’t inadvertently user intervention), and must build the full application. break page components. This can be done by using Next, the infrastructure should run automated tests an automated tool to define additional best practices every night against the application built by the nightly customized for an individual page or group of pages, build. The tests should run automatically without user and enforcing them on the appropriate rendered intervention, and a report should be generated and pages. Enforcing other best practices regarding well- possibly e-mailed with the results of the run. The formed and accessible HTML is also important here. report should categorize the results in an easy-to-read Figure 1: Focus areas for ensuring quality in an AJAX application 20 March 2007 AJAx.SyS-coN.coM
  • way, or else they’ll be ignored. But the infrastructure isn’t enough. There Client-Side JavaScript Engine must be a culture in the development group where failures in the nightly Validating the functionality of a client-side JavaScript engine may tests aren’t allowed to remain. Failures must be addressed as soon as they be the most difficult aspect of ensuring quality in an AJAX applica- appear. Otherwise you lose the benefit of automated tests. tion. This is why it’s important to use both best practice enforcement This is where the real power in the quality infrastructure lies. The and functional testing to attack the problem from multiple angles. development group should adopt a practice that, as each new feature Functionally validating the JavaScript engine is done by constructing is added, one or more automated tests that validate the feature are functional tests for each user interface control in your Web applica- added to the test suite. In addition, for each bug that’s fixed, one or tion. You should use an automated tool that lets you record a user’s more automated tests should be created that find the error being actions as he interacts with a browser and set up validations that fixed. Personally, some of my nightly tests are JUnit-based. I’ve made it ensure the control correctly responds to the user’s actions. Since a practice to create a JUnit test that catches the bug I’m fixing before I what the user sees in a Web application is directly tied to the brows- actually fix it. Then I know that my JUnit test reproduces the problem, er’s DOM, and since AJAX applications rely on heavy manipulation of and by running it I can know when I actually do fix the problem. This the DOM, the automated tool should be able to perform validations speeds up my development AND adds another test to my test suite. at the level of the browser DOM. Tools that emulate a browser, rather By adopting these practices, you’ll develop a large array of tests in than actually using a real browser for testing, are probably not going the long run. If they all succeed, you can be reasonably sure that your to be able to accurately test the application. The tests should be application has no major flaws. If you have to put out an emergency component-level tests of individual page components, rather than build and you have no time for testing, you can have a reasonable functional scenarios of the Web application as a whole. When these amount of confidence that the application is stable and works cor- tests are combined with accurate regression tests on asynchronous rectly if the automated tests succeed. This is especially true in the message content, you can have confidence that your AJAX compo- world of Web applications, where features are bled into the applica- nents are working properly. tions constantly. End-to-End Functional Scenarios Functional Tests for AJAX Applications Automated functional tests of the scenarios that describe your Web Since automated nightly tests are so important, let’s focus on the application users’ actions are crucial to ensuring that your Web application details of what should be functionally tested in an AJAX application. is providing its critical business functions. This is where you validate that all aspects of the complex AJAX application are working together properly. Back-end Web Services You should identify what the important scenarios are, and then use an Many AJAX applications depend on Web Services. These may be automated tool that can record and replay the scenarios easily. The tool services that your company owns and manages, or they may be services should let you validate that the user interface updates properly, as well exposed by your partners. For Web Services owned by your company, you as test that the user’s actions can actually be done. As with validating the should use an automated Web Services testing solution to validate that JavaScript engine, the user interface validations should be done at the level the Web Services provide the functionality they’re supposed to, and that of the browser DOM. In addition, since it’s probably important for your they handle both expected and unexpected inputs. Your Web application Web application to support multiple kinds of browsers, the test tool should depends on these Web Services providing the expected data, so you need let you define the tests once, yet run them against the different browsers to ensure that they do. Whether you own the Web Services or you use and different browser versions that your application needs to support. services exposed by someone else, you also need to validate that your Web application correctly handles unexpected responses from the Web Functional Security Tests Services (such as the service being inaccessible, the service returning Functional security tests ensure that the security policy that’s been malformed or unexpected data, etc.). This way you can be certain that put in place actually works and is being followed. These tests should sup- your Web application will provide an appropriate response under unex- port, rather than replace, the policy. The tests should send various kinds pected conditions. of unexpected inputs to the Web application to validate that it responds appropriately to hacker attacks (such as cross-site scripting and SQL Asynchronous Message Content injections). Server responses should be validated to ensure that the appli- When an error occurs with the page-update mechanism of an cation filters out the inappropriate inputs and doesn’t reveal information AJAX application, it’s typically in one of two places. The first place that would help a would-be hacker with further attacks. is in the contents of the asynchronous messages used to commu- nicate with the server. The second place can be in the logic of the Conclusion JavaScript engine that processes the asynchronous messages and Creating a quality infrastructure will let you deliver your applica- that updates the user interface. So it’s important to validate that the tions quickly, but with confidence that they are reliable and robust. server returns expected content for the asynchronous messages. This is especially true of AJAX applications. Creating the infrastructure Regression tests should be set up to verify that the server returns may require a significant investment of time and resources upfront; the correct responses for both expected and unexpected inputs. If however, experience with my own development and with that of cli- there’s a problem in the Web application, and these tests are suc- ents has shown that the gains from finding and preventing errors early ceeding, then the problem must be somewhere in the client-side using a quality infrastructure are many times greater than the initial JavaScript engine. cost. n 22 March 2007 AJAx.SyS-coN.coM
  • AJAx & SoA The Big Shift by Kevin Hakman AJAX and Web Service Bus architectures enable the shift from request and response to message and event-driven application architectures T here have been numerous articles over Client Side: Pages Become Applications the last year on how the complemen- Unto Themselves tary nature of AJAX and service-orienta- In many ways AJAX has provided the perfect tion together are rapidly transforming the way in complement to HTTP information services. AJAX which we design, architect, deploy, and manage is highly optimal at consuming raw information applications. The ramifications of this change over HTTP be it SOAP XML, JSON, or other formats, , , impact nearly every aspect of business application and transforming that information into what the development, from design conception, architec- user sees on the screen. Both AJAX and SOA were tural planning, and implementation to unit testing born from taking the Hypertext Markup Language and monitoring. New methodologies, tools, and (HTML) out of Hypertext Transfer Protocol (HTTP) infrastructure are now emerging as the industry transmissions. Instead of a Web server generating an evolves from the three-tier system concepts that HTML page, it provides an XML, SOAP or JSON data , have dominated the last decade on the Web into service with which any number of applications can the Service Oriented Architectures (SOA) currently communicate. And instead of a Web browser repeat- being implemented. edly, often redundantly, rendering a stateless, static Let’s look at several major areas of application HTML page received from the server, the browser development and architecture that are shifting from gets and executes JavaScript to update portions or three-tier implementation styles to AJAX and SOA the entirety of the user interface within the stateful implementation styles to deliver more powerful, context of a single HTML page. high-performance, extensible, manageable, and With the tremendous exploration of the relation- cost-effective solutions: ship between AJAX and services that has occurred • Client Side: Web pages are becoming applica- over the past 18 months, it’s important to under- tions. stand the difference between the ideas of “AJAX- • Web Protocols: Publish/Subscribe events and enriched pages” and “AJAX applications.” A quick messages over HTTP are becoming peers with peek at Yahoo!’s personalized homepages and Yahoo! standard HTTP Request/Response. Mail easily demonstrates the distinction. On the My • Server Side: Centralized, silo’d application deploy- Yahoo! page you get a variety of AJAX interactions ments are getting plugged into Enterprise Service within the page. You can drag-and-drop a content Buses to make way for massively distributed ser- section to rearrange the layout, even remove an item vice deployments. from the page with an AJAX call in the background • Coding: Custom coding page-based GUIs is while it fades from view, then other content areas diminishing in favor of assembling solutions from flow in to fill the gap. Pretty cool. But as soon as you ready-made parts and services. click a content item, you go to a different page and so primarily navigate page to page to page. You go In general this evolution can be summarized as to the information, though some of it comes to you moving from homogenous, language- and vendor- through AJAX without leaving the page. I call these centric solutions, to the mixed environment, het- AJAX-enriched HTML pages and the nuances they erogenic systems typical of a business information add atop static HTML are excellent enhancements. system. Now try dropping in on Yahoo! Mail (beta). The 24 March 2007 AJAx.SyS-coN.coM
  • experience there is akin to Microsoft Outlook. The GUIs, AJAX is evolving with libraries focused on semantics of the solution lack the concept of “page” the value of enriched HTML pages or streamlining altogether. Instead of navigating from page to page the process of creating richer, software-style GUIs. to page, information comes to you via tabs, alerts, Therefore the question won’t be “which AJAX library windows, drag-and-drop, and the characteristics should I use” but “which collection of AJAX libraries of robust software solutions. Of course the units of should I use.” For example, one of our customers (a Internet advertising are based primarily on pages large investment bank) uses Direct Web Remoting and navigating between them, so we’ll certainly not (DWR) for simple enhancements to HTML pages see the page disappear. In addition, pages are great when it wants asynchronous access to its server-side for documents, forms, reports, and lots more. At the Java environments and simple updates to the HTML same time, AJAX liberates us from the paradigms elements with that data. In addition, it uses the Dojo of the page so that we can deliver richer business Toolkit when it needs richer controls in those HTML productivity applications akin to the experiences of pages. Finally, it uses TIBCO GI when it needs to desktop installed software, but, of course, do so over deliver richer business productivity solutions as part the Web via the browser. of its core business processes. Three different kits Where desktop-style applications were created used for three different problems. in the past with VisualBasic, Java Swing, MFC, or the like, they can now be substantially created and Web Protocols: Real-Time HTTP deployed using AJAX techniques. And where GUIs Messages and Events for business productivity solutions were bound to Aside from the Web page, request/response com- the limited paradigms of HTML pages and forms, munications are architecturally significant. This is AJAX opens a whole new vocabulary of end-user what Web servers have been optimized to do for the interactions that go well beyond the tabbed pane last decade – get a request, send the response as fast and into sliders, editable grids, tree tables, hierarchi- as possible, and close the connection. Inherently, cal menus, modal dialogs, toolbars, vector graphics the HTTP protocol is much like flipping pages, and charts, accordions, spinners, and date pickers. going from one to the next, sitting idle in between. AJAX libraries are already optimizing themselves Accordingly, the user experience is diminished by for both AJAX pages and AJAX application-style the request/response limitation, coming up short implementations. Much the way that the Java lan- relative to the streaming data and server-originating guage has .jsp for generating pages and that AWT, event capabilities of client systems that run outside Swing and others have for generating software-style the ubiquitous browser. Figure 1: Evolution to AJAX and SOA-enabling capabilities AJAx.SyS-coN.coM March 2007 2
  • One core limitation of going beyond request/ response over HTTP has been that neither an HTML page nor JavaScript can currently register an IP address that a server can address messages to the way their thick-client cousins can. So AJAX vendors are working to provide solutions at the next best level — keeping the HTTP connection open so that as soon as data is available, it can be sent without getting a request from the browser first. The AJAX library DWR calls this “ReverseAJAX.” Dojo is a contributor to the CometD project that’s creating a persistent HTTP solution, and TIBCO is preparing to release its TIBCO AJAX Message Service product to extend message buses to the browser over an HTTP channel. The persistent HTTP connection helps avoid the redundant polling loops approach that can tax a Web server with handling unnecessary requests, but nonetheless, traditional servlet contexts can Figure 2: Evolution of desktop GUIs in network computing face scalability challenges. The reality is that Web application servers are designed to get an HTTP request/response as fast as possible then close the connection. But just as the page is evolving into a stateful container for richer AJAX applications, the HTTP 1.1 protocol, now predominant in most application servers, provides the foundation for persistent HTTP connections capable of keeping a connection open so that multi-part information can be sent from the server to the client. The challenges aren’t in the protocol itself, but in the server-side implementations as far as scale goes. The most scal- able solutions today work outside the strict servlet specification’s one-connection-to-one-thread rule by enabling thread pooling and hence more scale for pushing data through always-on connections. Besides, since there’s a single pipe through which Figure 3: Request/response communications evolve to publish/subscribe information must be pushed, savvier server-side implementations include notions of multiplexing — merging multiple streams of messages and events into a single stream through the single connection. Solutions using these techniques claim to have supported close to 10,000 concurrent connections on single-CPU machines and, at the same time, the servlet specification is under review with a view to shared threading. Greg Murray of the Jetty Servlets Project also contends that the browser only provides two HTTP connections. So if one is always-on for instant information feeds, the other must be left for tra- ditional request/response processes like getting images, files, and information that need not be sent instantly. The exciting thing from a developer or archi- tect’s point-of-view is that persistent HTTP can blur Figure 4: The evolution of serving pages to point services to service buses the dividing line between client and server so that 26 March 2007 AJAx.SyS-coN.coM
  • very low-latency events and messages at the client via request/response. And there are persistent HTTP become the equivalent of events and messages at connections to the server-side message bus that the server. And the conceptual diagrams of distinct connects the services through common governance, client and server actors working across an Internet policy management, and SLA infrastructure. In such cloud get replaced with an “event cloud” in which an architecture, instead of procedurally coding a both the connected clients and servers exist using request/reply to a service that explicitly handles the server-side and client-side message buses to pub- response data and updates the GUI, a user can use lish information to topics so that other parts of the the publish/subscribe and asynchronous call inter- system subscribing to those topics can intercept and faces in various AJAX toolkits to set up event listeners handle the information accordingly. and event handlers that wrap calls to the services. Assuming support for 10,000 concurrent connec- That object then becomes a reusable bit of code that tions, the benchmarks being reported by vendors can be dropped into various solutions. Next, a GUI mean a single CPU implementing these techniques component, such as a data grid, can be configured can be just as scalable as today’s application serv- to listen for the availability of new information ers doing request/response handling. I personally from that service and so too can a history list, a log, wouldn’t use this technique if I were Google or and detail windows subscribed to information from Yahoo, both of which serve millions of users concur- those services. Thus, when data comes back from rently. However, for business productivity solutions the service, an event is thrown and the GUI objects where end-user communities are typically far less listening for that event handle it. than 10,000, message- and event-based application These approaches enable faster and more man- architectures have much to offer as a general imple- ageable development, and enforce reusable modular mentation technique for AJAX RIAs. design patterns that facilitate efficient work among Having such a capability opens a wide range development team members. This leads to greater of potential applications and solutions that could reuse of assets with much less chance of getting be deployed using AJAX and further diminishes tangled in procedural JavaScript hairballs of code. the gap between what’s feasible in a browser and what requires pre-installation of specific runtimes Enterprise Service Bus and Beyond or client software. Real-time applications like chat, The highly visible, visual, and easy-to-find Google streaming stock quotes, alerts and notifications in Maps remains the harbinger of AJAX for many in the dashboards, and other types of collaborative appli- industry. And while Google Maps certainly helped cations become feasible, while avoiding the high popularize the idea of AJAX through the unique cost of desktop-installed software or the overhead experience it offered end users, equally noteworthy and user disdain of downloading and upgrading is the underlying service Google exposes to overlay plug-ins. Moreover, such capabilities over HTTP information on the maps. The service interfaces are far more firewall-friendly than applet or plug- are savvy, accepting input in many variations of in approaches that may require additional firewall addresses, landmarks, and cities, resolving those ports being opened — something business secu- close-to-natural-language phrases and returning the rity folks abhor. Further messaging concepts also relevant data sets in milliseconds. Kudos to Google include the notion of queues, which are not only for not only exposing the breakthrough GUI capa- useful in real-time data solutions, but also when bilities of AJAX to the masses, but also for backing it combined with offline persistence. Multiple AJAX with scalable services that could handle the ways in toolkits have shown offline data capabilities. For which humans want to ask for information (not to example, Firefox now has native support for this mention the data store behind the system with all capability and Internet Explorer allows 1MB of stor- that information). Google Maps stands out because age per domain. These capabilities assist in tasks like the solution is non-trivial at all these levels and synchronization when a user goes back online. should be heralded for its accomplishments. So AJAX event and message paradigms can also However, let’s get back to business and to the het- ease the composition of GUIs in much the same erogeneous, diverse, and more complex reality that way that Visual Basic development is streamlined most of us creating business solutions must grapple by registering listeners for various events. Consider with. While Google Maps stands out as exemplary, an application architecture where both services as it’s also an anomaly in the context of 99% of the well as GUI components can publish and subscribe business we do every day as creators and users of to topics. On the client side, there’s an event and software solutions. Google has the advantage of message bus implemented in JavaScript connected being able to create, maintain, and optimize that one 28 March 2007 AJAx.SyS-coN.coM
  • phenomenal service and publish that one sexy GUI Java, TIBCO’s implementation of the JSR-208 specifi- for others to use or overlay in mashups with data cation in its recently announced ActiveMatrix prod- from other data relevant to geographic contexts (and uct has demonstrated support for .NET containers without having to generate revenue from it too). But and services as well on the same infrastructure. what happens if you have five services to implement Thus the homogenous three-tier, platform-specific and manage? Probably doable without much other architectures of the past decade are giving way to infrastructure, right? What about 50 or 500? What heterogeneous service-oriented systems managed about 5,000 services? Not to mention the hundreds by service-bus architectures, even crossing the great of application screens that will interact with those Java versus Microsoft dividing line. Services can be services. Those might seem like large numbers com- implemented in a variety of languages, but are then pared to simple use cases and solutions. But the normalized into XML, SOAP JSON, or other formats , reality for independent software vendors, solutions for consumption by other systems of potential vary- consultants, and corporate IT shops creating enter- ing types. Systems with multiple service endpoints prise solutions is that support for hundreds (if not can leverage message bus architectures at the core thousands) of services is or will soon be required as to provide needed integration conduits between sys- enterprises mandate interoperation with their SOA tems, enabling massively distributed systems with infrastructures in their procurement and vendor centralized governance and policy management by selection processes. virtue of the bus. In contrast, from a policy and When dealing with integration challenges due to governance point-of-view, the three-tier Web appli- the number of components in a system like those, it’s cation server world is inherently more difficult to been generally accepted that message bus architec- manage across disparate systems that don’t share the tures address these kinds of issues best. In fact, Sun’s common infrastructure of the bus. The good news is JSR-208 specification Java Business Integration (JBI) that these bus architectures are designed so that you has an Enterprise Services Bus at its core, extended can plug your existing assets into them. So get on the for use with a variety of Web Service types. Beyond bus.
  • “AJAX and SOA will Less Code, More Use of Ready-Made Parts AJAX and SOA also pave the way to faster solution continue to erode development. As described earlier, an implemen- tation centered on event and message paradigms the need to enables significantly more manageability around client-side and server-side components and fosters a greater opportunity for reuse of such components. develop and deliver Clearly, reuse is understood in the context of SOA where a single service can have multiple consumers installed software and so greater value in relation to the cost of build- ing and operating that service. One can see similar solutions” trends on the client side enabled by AJAX as well. Reusable AJAX GUI components like editable data grids, charts, sliders, color, and date pickers are now readily available. Instead of building these up from DIV and SPAN tags, you can now include the higher- level notion of an editable data grid and configure its behaviors as well as its look-and-feel. Numerous AJAX toolkits provide these kinds of ready-made widgets for use in applications. The mashup craze also makes this readily evident. For example, an investment in creating the orchestrating logic (not the service or the GUI components) enables you to take a GUI from location G, and overlay it with data from sources C and D. But as we discussed before, in business environ- ments things can get more complex, quickly. Google and craigslist have the enviable simplicity of being publicly accessible. In the business world, not every- one is privileged to access a service, do certain tasks, or see certain information. Here again, centralized policy management across a message bus architec- ture greatly reduces the complexity of creating AJAX and SOA solutions and deals with cross-domain security issues in a managed context. Conclusion AJAX and SOA will continue to erode the need to develop and deliver installed software solutions. Many developers are getting started in the evolu- tionary process by adding some AJAX and a few ser- vices to the basic three-tier infrastructure they have in place today. However, businesses seeking to gain Kevin Hakman is Co-founder, TIBCO General greater benefits need to look to rich AJAX applica- Interface, TIBCO Software Inc. Prior to TIBCO tions in concert with Enterprise Service Bus infra- General Interface, he was the co-founder of structures capable of governing hundreds or thou- Versalent Inc. a leading provider of enterprise sands of services. In addition, the advent of scalable client technology. Prior to Versalent, he founded real-time protocols over existing HTTP connections a series of successful emerging Internet tech- will further enable rich client/server-style business nology and ecommerce ventures. He has also applications to be implemented and managed more written for eBusiness Journal and HotWired. efficiently, further displacing installed runtimes and khakman@tibco.com software. n 30 March 2007 AJAx.SyS-coN.coM
  • AJAX for Java Backbase offers a comprehensive AJAX Development Framework for building Rich Internet Applications that have the same richness and productivity as desktop applications. The Backbase AJAX JSF & Struts Editions: • are based on JavaServer Faces (JSF) or Struts/JSP • run in all major Application Server • support development, debugging and deployment in Eclipse • embrace web standards (HTML, CSS, XML, XSLT) Download a 30-day Trial at www.backbase.com/jsf i: www.backbase.com t: (866) 800-8996 e: sales-us@backbase.com © Backbase BV - all rights reserved. BACKBASE is a trademark of Backbase BV.
  • Interfaces Automatically Testing by Reginald Stadlbauer AJAX User Interfaces in a Cross-Browser Environment The reason for automating user interface tests and the challenges and solutions of creating automated tests for AJAX applications T he advent and rapid adoption of AJAX tech- Motivation nology by the Web community has truly revo- First, let’s look at the motivation for automating lutionized the user experience as well as the the testing of the user interface. development of Web applications. AJAX overcomes the technical limitations of classic post->submit- • Faster: Once automated tests are available, it’s >reload CGI applications. So one can implement much faster to execute the tests than when doing complex and advanced tasks as Web applications with this manually. More tests can be executed at the an appealing user interface. The result is that today’s same time and run more often (like every night). AJAX Web applications don’t have much in common This way regressions are found quicker after they’re with the old-style Web applications anymore but are introduced. This makes finding and fixing the bugs on a par with classic desktop GUI applications in that lead to the regression easier. Bottom line, we terms of sophistication. Combined with the Web’s save time, money, and nerves. network transparency and easy deployment opportu- • Trivial to replay in different configurations: Once nities the result is a development environment with a test is automated and the right tool has been hard-to-beat power. chosen for the task, there’s no additional effort Many Web technology vendors have understood to run a test in different configurations (different this trend and have created and marketed powerful browser, OS, hardware, etc.). A good Web applica- Web client frameworks. By using these toolkits it’s tion should work on at least the most common simpler nowadays to create a Web application with an browsers such as IE 6, IE 7, Firefox 1.x, Firefox appealing GUI than to create a classic desktop GUI 2.x, and Safari on Windows, Linux, and Mac OS X. application. This makes nine configurations in total, so testing This development now asks for new solutions manually has an overhead of 800% over testing for a vital part of the software development process: automatically. testing the new-style user interfaces – ideally auto- • Reliable and reproducible: Good programmers mated testing. It doesn’t suffice anymore to test the and test engineers strive to work efficiently. This back-end and run only unit-tests. The user interface means they optimize monotonous tasks. Normally, Reginald Stadlbauer is co-founder and has to be tested as well to provide high-quality appli- this is a good thing since this way innovative solu- CEO of froglogic GmbH. Born in Graz, cations. tions are created. When executing a manual test, Austria, at university he joined the KDE While engineers testing AJAX GUI applications optimization is a bad thing. It’s desirable to exe- project and wrote the office applications principally face the same kind of challenges as when cute exactly the same steps every time. Otherwise KPresenter and KWord. In 1999 he started testing classing GUI applications, the dynamics and issues and problems won’t be reproducible, or working for Trolltech ASA, the creator of the networked nature of AJAX applications as well as the even worse, not found at all. Humans aren’t suited Qt GUI toolkit. In his four years at Trolltech variety of Web toolkits, available Web browsers, and to running the same tests over and over again. Reginald was part of the team leading the operating systems pose additional challenges. Computers are the exact opposite. They’re good Qt, Qt Designer, and QSA development. In This article will discuss the motivation for auto- at executing the same over and over again. They’re 2003 Reginald helped start froglogic, spe- mating user interface tests and the challenges and more reliable testers than humans. cializing in the automated testing of user solutions of creating automated tests for AJAX appli- • Relieve testers from monotonous tasks: When interfaces by providing services and the cations. The material is based on the collected experi- automating a test, test engineers don’t have to do leading automated UI testing tool Squish. ence of providing consulting and support services in the boring job of executing the same manual tests reggie@froglogic.com. real-world automated testing scenarios. all the time. Instead they can work on interesting 32 March 2007 AJAx.SyS-coN.coM
  • tasks such as creating new tests, setting up auto- myriad open source and commercial Web client mation frameworks, and analyzing the results that toolkits each providing their own special imple- provide additional motivation. mentation of advanced controls such as layout controls, tables, trees, menus, etc. – not even While all this clearly speaks to test automation, counting the high number of unknown internal one should never expect an automated testing tool to Web client frameworks. do all the work for you. Using an automated testing It’s highly unlikely that there will ever be an tool you can’t get rid of your testers. At least initially automated testing tool that will support all of some work has to be done to create the tests and set these frameworks out-of-the-box. Does this mean up the framework. Tool vendors who claim that their that it’s impossible to create robust automated products will automatically create all the tests for you tests for your application if you use a Web client are naive or guilty of negligent misrepresentation. toolkit that isn’t supported by a testing tool? There will always be a few tests that simply require The answer is: No, it’s still possible. too much effort to automate. Checking a printout of When evaluating Web testing tools it’s advis- the application is something that you probably might able for you to find out if it’s possible to extend the still want to test, for example. So the goal of 100% test framework yourself or, even better, if the vendor is automation isn’t feasible. willing to extend the testing tool to recognize and Automating most tests will deliver software of support the controls you’re using. So even if your a higher quality while reducing costs. It’ll get you Web client toolkit isn’t supported out-of-the-box, faster releases by shortening the long manual test and it just needs a way for extension to create robust release cycles. automated tests. This means what you have to watch out for is Challenges and Solutions that the tool provides the necessary concepts to This section will discuss the main challenges and support the toolkit abstractions discussed above. solutions when setting up automated UI tests for If a tool is advertised to generically support testing AJAX applications. Common mistakes will be covered every Web page there is, be cautious. This usually as well. means that actions will be emulated coordinate based, sometimes ignorant of the type of ele- Robustness and Object Identification ments. This will break sooner than you think. The main requirement for an automated test is • Object Names and Object Map: While DOM that it has to be robust and not break when the appli- objects may have unique IDs or names, this isn’t cation being tested changes. Neglecting this impor- always the case. So the testing tool has to provide tant requirement is one of the main reasons for failure other means to identify an object. It can do so of many automated UI testing efforts. by considering a set of properties that – taken To create a robust test, a test script has to interact together – make up a unique identification. This with the AUT (application under test) in an abstract again requires knowing the Web client framework way. This means that in emulating a click, for exam- built into the testing tool but allows for the devel- ple, on a tree item in an AJAX tree control, it isn’t good opment of robust tests. enough to click to a fixed coordinate (x, y) in the Web page. It isn’t even good enough to click a specific DOM <span class=”button” onClick=”search();”> element (e.g., a DIV containing the tree item repre- <p>Search</p> sentation) without knowing more. Both ways, the test </span> will break quite easily if the position, representation, implementation, or structure of the Web page or tree An HTML element without a single unique id attribute control changes. To overcome this, a testing tool has to fulfill the {tagName=’SPAN’ innerText=’Search’ } following requirements: Generated attribute tuple identifying the element • Toolkit Knowledge: A testing tool has to recognize high-level controls (tree, table, layout controls, Using an object map that maps symbolic names date picker, input field, buttons, menus, etc.) (as used in the test script) to real names (as used in the and provide an interface to interact with the con- Web application) also eases maintenance. If an object trols and query their states and properties on an name changes in the application, it only requires one abstract level. This requires knowing about the change in the central object map without touching Web client toolkit built into the testing tool but as the test cases. a result, robust tests can be written. • Scripting Language: Test cases should be written One special challenge in the AJAX world is the in a scripting language that provides common AJAx.SyS-coN.coM March 2007 33
  • language features such as conditions, loops, sub- This means a test needs to be able to synchronize routines, and so forth in addition to functions to with the state of the Web application. Good testing access files, network, databases, etc. This creates frameworks provide such synchronization mecha- sophisticated tests. Tools that only provide a list nisms. There are several kinds of synchronizations of statements for test cases are too limited to do that can be useful: anything useful except a few simple tests. As an example imagine creating a test for an • Page loading state: A function to wait until the cur- online store. You probably want to test adding rently loaded page is completed multiple items to the shopping cart. To implement • Object availability: A function to wait until a given that, a loop is required. Also, imagine that you don’t object is available want the test to add every item to the shopping • Arbitrary expression: A function to evaluate an cart but only those that cost less that $10. For this arbitrary script expression and wait until it evalu- you’ll need a conditional. Finally, you might want ates to true. For example, to wait until an element’s to check that the order has been written to the property has a certain value. database correctly. For this you’ll need a scripting language that offers a database API. Using such functions it’s possible to create test To be able to implement such a test properly, scripts independent of timing and network speed. you’ll need a versatile scripting language for your Of course, the synchronization functions should also test case. provide the possibility of specifying a timeout to make sure a test doesn’t hang forever due to, say, an unex- If a testing framework provides the features above, pected error. it’s possible to create robust tests. This way a click on This uncovers another feature that’s very useful: a tree item may be emulated using a function call Event handlers. To deal with unexpected errors such such as clickItem(“files_Tree”, “readme.txt”) instead as message box popping up, many tools provide a of a click to a coordinate position or unknown generic way to handle such events and, for example, close the DOM element. If the Web page or the tree control unexpected message box after logging its content in changes, the tool will still locate the correct tree the test result log. control and item in it to click it. Even if the internal implementation of the tree control changes, the tool Verifications can be adjusted to emulate the click correctly while Besides emulating user events, the main task the test script won’t have to be changed. covered by automated UI tests is the automatic verification that will lead to test passes and fails. One Synchronization common mistake is the excessive use of screenshot One special challenge when creating tests for comparisons in automated UI tests. AJAX applications is dealing with the asynchronous While screenshot comparisons look promising at nature of Web applications. Unlike desktop applica- first glance because they make it easy to verify that the tions, where most operations are instantaneous, most screen looks as expected, this approach is doomed operations in AJAX applications require communica- to fail once the application undergoes the slightest tion with one or multiple servers. The connections to change, not to mention the graphical differences of these servers may have varying bandwidths or even the rendering engines when running tests in different be unreliable. Web browsers. Table 1: Object map 34 March 2007 AJAx.SyS-coN.coM
  • The approach of comparing the structure of the data-driven testing. This means that the test data is complete DOM tree against expected data isn’t much moved into a separate file and the test script only con- better. Both approaches compare more than 90% tains the test logic. The test script reads the data file irrelevant data (noise) and less than 10% of the really and executes the test logic for each test data record. interesting and relevant data. This means there’s a This way new tests can be added without having to very high probability that a test fails because some- modify the test scripts. thing irrelevant changed. As an example of data-driven testing imagine a The best and most robust approach is to verify script that reads article numbers from a text file and only the mentioned 10% in a page. This means a test enters those numbers into a form of your Web applica- should retrieve references to the object and controls tion. This script is “driven” by the data that’s fed to it. you want to verify and query, and compare the states and properties on this objects against expected val- Test-Automation, Distribution, and ues. This will ensure that only relevant checks are Different Environments made and if a test fails, it means that a real regres- Once tests are created following the guidelines sion has been found. Unnecessary checks make tests outlined here, the next step is to automate the test unmaintainable and unusable in the long run. execution and reporting. As mentioned several times already, this requires a There are several things one should consider to deep knowledge of the Web client framework used and make effective use of test automation. The following the availability of a scripting language in the testing tool. key points make up successful test automation: Of course, there are some scenarios where screen- • Multiple Platform and Browser Support: A great shot verification can be used. This is true when check- advantage to Web applications is the possibil- ing graphical views such as charts, curves, etc. ity of running them on different platforms and in different browsers. As different types of browsers Creating Tests exhibit different runtime behavior and bugs the To aid in creating tests, a testing framework should tester has no choice but to verify correct behavior offer several individual tools. The most prominent is on each platform and browser. Needless to say this the event recorder. Using that tool a test engineer can would be a drag if done manually. But as soon as a run the Web application and execute the test scenario test is automated it just needs a click of the button manually while the testing tool records all the actions to replay it in a different environment. and generates a test script. Cross-platform and cross-browser support To create a useful test script, the testing tool has to is an important criterion if quality assurance is recognize the real widgets in the Web page and record taken serious. This doesn’t apply only to the test high-level actions as discussed. execution but also to the cross-platform avail- Another useful tool is a program to insert verifica- ability of each component that makes up the tion points. Such a tool should let the test engineer testing process. visually pick the objects and properties to verify and • Command-Line Tools and Remote-Control: To automatically create verification statements. automate tests successfully, the testing tool should Additional tools such as a verification point editor offer command-line tools to execute them. This and a test data editor come in handy too. Often all the way it’s simple to integrate the UI tests into exist- tools and some test management facilities are com- ing frameworks and test management systems bined in an IDE. and integrate the generated results. It should also be possible to control all the test runs Post-Editing, Refactoring, and from a central machine and run several tests simulta- Data-Driven Testing neously on different machines, platforms, and brows- Using tools such as an event recorder have been ers to make effective use of automated testing. deliberately downplayed in this article. A common beginner’s mistake is to think that automated tests Once the test execution is automated, a procedure should be created only using an event recorder and for following up on the test results has to be put in verification point editor. While such a test script will place. This can be a Web site displaying the results run and deliver results quickly, it’s always advisable to or e-mails with errors being sent to the engineers or post-edit test scripts to make them more robust and managers responsible. The best tests and results are easier to maintain. of no use if they aren’t inspected regularly to fix regres- Such post-editing tasks include factoring com- sions and any issues uncovered. mon actions into functions, inserting synchroniza- tion points, documenting code parts, and removing Support unnecessary steps. One very important feature of a test automation Another methodology that can be introduced is framework is vendor support. When starting with 36 March 2007 AJAx.SyS-coN.coM
  • automated testing many questions will come up and (preferable an open language such as Python or usually assistance is required. Also some adoptions JavaScript instead of a proprietary language) in the testing tool might be necessary to make the • Built-in knowledge of the Web client framework most effective use of it. used in the AUT (or a way to adopt and get the tool So a crucial factor in the success or failure of any adopted by the Web client toolkit used) test automation effort is the support you get from the • The possibility of freely post-editing and re-factor- testing tool vendor. During an evaluation you should ing tests make use of the vendor’s support service to find out • Tools aiding in the creating and management of if you get issues resolved quickly and if the vendor is tests preferably combined in an IDE open to necessary adoptions. • Command-line tools to automate tests • Qualified and responsive vendor support service Choosing the Right Tools Since the author of this article isn’t completely When evaluating a tool, don’t pay too much unbiased and works for froglogic, the vendor of the attention to components such as the event record- popular Web testing tool Squish, this article won’t er. While it should work reliably, it doesn’t have to attempt to recommend a specific tool. There are be perfect. Features that help create robust and several Web testing tools out there. A few meet most maintainable tests are more important. Don’t let of the requirements mentioned above, many don’t. yourself be fooled by false promises and quick So careful evaluation is necessary. Here’s a short sum- short-term results that don’t result in maintainable mary of what you should look for in a Web testing tool tests. when evaluating it: • If a vendor or tool makes one the following prom- • Cross-platform and cross-browser support without ises you should be very skeptical and stay away: having to adjust test scripts • The tool automatically creates tests for you or • Complicated setups such as special proxy serv- requires little effort to create tests ers shouldn’t be necessary for easy deploy- • Absolutely no programming skills needed ment • You don’t need test engineers anymore • Support for a scripting language for test scripts • Delivers 100% test automation n What do you need Your Web App to do? 1 Pick it 2 Install it 3 Customize it On-Demand, Open Source Web 2.0 Applications on the Hosting Environment You Choose. ajaxworld.etelos.com
  • Struts Struts Portlets with by Kris Vishwanathan AJAX in Action Challenges faced during implementation T he Struts Framework from Apache is a very • If the mapping specifies a form bean, ActionServlet popular, robust Web application framework. looks to see if one exists or it creates one. Many corporate companies have deployed • Once the form bean is created, ActionServlet pop- tons of Web applications using Struts. And they hit ulates values from the HTTP request. If the map- the ground with abundant technical resources. They ping has a validate property as true, ActionServlet can develop newer applications quickly. Portal imple- invokes the validate method on the form bean. If mentations offer a new challenge by introducing new the validation fails, the control flow ends there. frameworks and APIs. To leverage existing assets and • If the Struts configuration file specifies action skills, WebSphere Portal supports the Struts Portlet mapping then the appropriate action class ‘exe- Framework so Struts Web applications can be easily cute’ method is invoked with an instantiated form migrated to a portal. bean as a parameter. AJAX, or Asynchronous JavaScript and XML, is a • The Action may call other business objects and new happening technology to make Web applications repopulate the form bean with the latest values function like client/server applications. I mean Web and other business functions as needed. pages triggering requests based on events (asynchro- • Based on where you want to send the control next, nously) that refresh only specific parts of a page as the Action reads ActionForward and the Action opposed to refreshing the whole page. URI from the Struts configuration file and returns to the ActionServlet. The Struts Framework • If the ActionForward is a URI to the JSP to display There’s tons of information on Struts, AJAX, and the page, the control flow ends by sending the out- the Struts Portlet Framework available on the Web. In put to the browser or if it’s forwarded to another this article I’m going to provide a brief introduction to Action URI the above flow starts again. these topics; for more details check out the resources section. AJAX in Action The Struts Framework is an implementation of AJAX is not a new technology, but is the most hap- the MVC architecture, with Model being the business pening thing in the Web world that gives a desktop or logic represented using JavaBeans, EJBs, etc., View client/server application feel to your Web applications the presentation layer represented by using JSPs, (see Figure 2). ActionForms, and tag libraries, and Controller the ActionServlet and Action classes (see Figure 1). AJAX Control Flow • A Web page sends its requests using an Struts Control Flow XMLHttpRequest object and JavaScript function, Here is the typical request-response cycle for the which handles talking to the server. Web application using Struts: • Nothing has changed for the Web application • The client requests a path matching the Action server; it still responds to each request, the way it URI pattern. did it before. • The Web container passes the request to the • The server’s response only has the data it needs in the ActionServlet. XML form, without any markup or presentation. • The ActionServlet looks for the Struts configura- • The JavaScript dynamically updates the Web page Kris Vishwanathan is a senior software tion file, if this application has multiple modules without redrawing the whole page. engineer at IBM’s lab in Research Triangle it looks for the appropriate mapping for the given • Most of the page doesn’t change, only the parts of Park, NC. path in any of the Struts configuration file. the page that need to change is updated, and that 38 March 2007 AJAx.SyS-coN.coM
  • asynchronously. but it’s all on the client side and making it work with Struts Portlet Framework different server-side frameworks is a challenge. This Developers who have experience with the article is a result of my client experience in developing Struts Framework should adapt easily to the Struts Struts portlet applications with AJAX. In the sections Portlet Framework. The packaging for Struts Portlet above I briefly described Struts and AJAX. In the sec- Application is similar to a Struts application in the serv- tions below I’ll describe some of the challenges faced let environment. However, WebSphere Portal introduc- during implementation. To develop AJAX applications es additional challenges such as portlet modes, states, there are several toolkits such as Google Web Toolkit inter-portlet communications, portlet two-phase (GWT), DOJO, AJAX Faces, and JSON, but for simplic- processing, and multiple device support, which are ity’s sake we chose a plain vanilla implementation. addressed through the Struts Portlet Framework. For a The tricks to rendering content asynchronous- detailed explanation of this topic, see the Redbook IBM ly using AJAX has more to do with JavaScript and Rational Application Developer V6 Portlet Application XMLHttpRequestObject than any server-side tech- Development and Portal Tools. nology, however, getting the blend of AJAX working A portlet processes and renders differently than with server-side frameworks involves careful design a servlet. A servlet will do all its processing in the and architectural thinking. service method, while the portlet will divide action Making asynchronous calls to the server using processing and rendering into two separate methods, AJAX best fits a portal scenario with different portlets hence portlet processing is defined as a two-phase representing different back-end application views. approach. Figure 3 explains the two-phase processing However, this feature isn’t supported with portlet approach of a Struts portlet. URLs since each response from the portlet container To invoke actions in the rendering phase there is represents a portal page with different portlets with a new interface called IStrutsPrepareRenderer. For different window states and modes. Given this limita- more details see Executing Struts actions during the tion, the alternative we have is the XMLHttpRequest render phase of IBM WebSphere Portal. (http://www- object calling a servlet from a servlet container as 128.ibm.com/developerworks/websphere/techjour- depicted in Figure 4. nal/0504_pixley/0504_pixley.html). To demonstrate the above scenario I have used the IBM supports Struts Portlet Framework for both simple downloadable example shown below. IBM API and JSR 168 API portlet containers. Users As in Figures 5 and 6, when the user clicks on can easily migrate existing Struts applications to the menu items, the right-side blue box items get Struts portlet applications using either of the portlet’s refreshed without unloading the whole page. APIs. For more information on migrating and devel- Below are some of the challenges we had and I’ll oping newer applications using the Struts Portlet explained how we addressed them. Framework see the Portal Info Center. JavaScript Objects Struts Portlets with AJAX AJAX applications use the XMLHttpRequest Object Though AJAX isn’t the right solution for every Web and client-side JavaScript, and as these applications application, there’s increasing curiosity and enthusi- become more complex it becomes difficult to main- asm among organizations to explore its benefits and tain the code using plain JavaScript functions. Object- see how it works for their applications. AJAX isn’t new, oriented programming is ideal and proven for such Figure 1: MVC Architecture and Struts Components AJAx.SyS-coN.coM March 2007 39
  • I defined all other JavaScript functions in different js files. Below is the definition of the ‘ContentHelper’ function. function ContentHelper(params){ //Parameter Variables if (!params){ alert(‘Missing parameters while instantiating!’); return {}; } if (typeof(WebFormUtils)==’undefined’){ alert(“The utils package is not Figure 2: AJAX control flow included!”); return; } var namespace = params.namespace; var urlContextPath = params.urlContextPath; var formUtils = new WebFormUtils({ namespace : namespace }); var AJAXurls = new AJAXURLs({ namespace : namespace, urlContextPath : urlContextPath }); var AJAXEngine = new AJAXEngine({ Figure 3: Struts portlet control flow redirectHandlerFunction : formUtils.han- dleAJAXRedirect, complex applications. JavaScript offers many differ- retryPromptMessage : “Warning, there was a ent ways of defining objects, but it’s not a full-fledged problem object-oriented programming language. There are during an attempt to communicate with the several efforts by different people aimed at provid- servern” ing workarounds for object-oriented programming + features such as inheritance, reflection, and interfaces “Would you like to retry? (It’s recommended using JavaScript. to wait a bit first)n” + JSON (JavaScript Object Notation) provides guid- “If the problem persists, please contact Help ance on JavaScript object notation. In our example, Desk”, we have used JSON guidelines and defined all the autoRetries : 2, JavaScript functions as objects. We have also defined retryDelay : 10000 all the functions as external js files so that all the cli- }); ent-side logic is kept modular and separate from the ….. JSP file, following portlet best practices. ….. Here is the JavaScript code snippet from the down- } loadable sample application defining an object and calling the function as object instance methods. The object/function above in turn instantiates other objects such as AJAXUrls and AJAXEngine. if (typeof(contentHelper) === ‘undefined’){ var contentHelper = []; Handling Namespace with an } AJAX Response contentHelper[‘<%=contentAppNamespace%>’] = new As specified in Figure 3, Struts portlets make asyn- ContentHelper({ chronous AJAX requests to servlets. Servlets process namespace : “<%=contentAppNamespace%>”, the request and send the response back to the client, urlContextPath : “<%=request.getContext- which in turn is suppose to refresh certain parts of Path()%>” the portlet JSP page. Portlets being namespace-aware, }); it’s very important that any Web page refresh be namespace-aware. Unfortunately, the servlet is not 40 March 2007 AJAx.SyS-coN.coM
  • Accessing a Form Bean in the Servlet Struts actions have a nice way of collecting all the HTML form elements using an Action form bean. Behind the scenes, the Struts Framework binds all the HTML form elements to a form bean as per the action mapping specified in the Struts configuration file. Through an AJAX request you can use a similar mechanism using a BeanUtils package when you’re posting a form to a servlet so you don’t have to do a request.getParameter() for each element value. For more information on the BeanUtils package see the Apache Struts Framework Web site. Here’s the call to AJAX request posting the HTML form: AJAXEngine.request({ “url” : url, “title” : “Side Menu”, “responseFunction” : receiveLinkResults, “postBody” : serializeContentForm(), Figure 4: Struts Portlet with AJAX data flow “method” : “POST” }); function serializeContentForm() { var url=””; url+= “filter=”+encodeURIComponent(document. getElementById(“filter”).value); url+= “&selectType=sideMenuContent”; url+=”&namespace=”+this.namespace; return url; } On the server, you can retrieve form elements posted as below: Figure 5: Portal page view for first menu item selected ContentBean contentBean = new ContentBean(); try { BeanUtils.populate(contentBean,arg0.getParameter- Map()); } catch (IllegalAccessException e) { // TODO Auto-generated catch block e.printStackTrace(); } catch (InvocationTargetException e) { // TODO Auto-generated catch block e.printStackTrace(); } System.out.println(“Filter=”+contentBean.getFil- ter()); System.out.println(“SelectType=”+contentBean.getSe- Figure 6: Portal page with blue box refreshed for the second menu item selected lectType()); aware of the portlet namespace. To resolve this issue We need to make sure that the ContentBean has we have passed namespace as a parameter for every the properties specified in the HTML form. In our AJAX request so that the servlet response can prefix all case, we used the same Action form bean used by the object ids with the appropriate namespace. Struts portlet. 42 March 2007 AJAx.SyS-coN.coM
  • Session Sharing WebSphere Portal. In this article, I explained how to Once you define the servlets in the same portlet blend the Struts Portlet Framework with AJAX. With application, you can share session objects among the AJAX on the client side it can work with any server- portlets, JSP and servlets. The only requirement is to , side framework. There are several other initiatives to make sure that the session objects are declared with get AJAX working with Java Server Faces (JSF), JSON- APPLICATION_SCOPE. RPC, and Java-like programming so that frameworks can convert it into client-side script. About the Sample Code The sample code is a downloadable zip file with References a strutsAJAXportlet.war file in it and can be down- • Apache Struts home page: http://struts.apache. loaded from the online version of this article at org/ http://ajax.sys-con.com You can install the war file • IBM Redbook: IBM Rational Application Developer in the WebSphere Portal server and put a portlet on V6 Portlet Application Development and Portlet any portlet page to see it work. If you install the war tools: http://www.redbooks.ibm.com/abstracts/ file in IBM’s Rational Application Developer you’ll SG246681.html find the source code for the client-side AJAX engine, • Executing Struts actions during the render phase JavaScript functions for request and response han- of IBM WebSphere Portal: http://www.ibm.com/ dling, and the server-side portlet and servlet for developerworks/websphere/techjournal/0504_ request processing. pixley/0504_pixley.html • Error validation and exception handling in port- Conclusion lets, using the Struts Portlet Framework: http:// Many organizations today want to leverage exist- www.ibm.com/developerworks/websphere/ ing assets to embrace new technologies. The Struts library/techarticles/0411_sriramoju/0411_sri- Framework is a very popular MVC pattern implemen- ramoju.html tation and very suitable for large enterprise applica- • Developing JSR168 Struts portlets: http://www- tions. The Struts Portlet Framework is an extension 128.ibm.com/developerworks/websphere/library/ of Struts that’s supported by all major releases of techarticles/0601_patil2/0601_patil2.html n oreilly Web 2 programme Mar 2007Page 1 02-03-2007 11:34:55 C M Y CM MY CY CMY K
  • Web 2.0 How Web 2.0 Makes by Langdon White Business Intelligence Smarter And what corporate IT needs to do to implement such solutions T he advent of Web 2.0 has upset the Internet The hallmarks of Web 2.0 and rich Internet appli- in some interesting ways, particularly with cations are: regard to user experience and participation, • User experience: Applications that feel like an the creation, derivation, and relevance of metadata, installed fat client delivered over the Web (e.g., and the ability to deliver new functionality by lever- Google Finance and The Baby Name Voyager), aging existing sites, thereby accelerating time-to- particularly allowing immediate, interactive market. This article considers how these concepts responses to user actions can be applied to benefit the world of business intel- • User participation: User feedback encouraged ligence (BI). We’ll discuss how users can benefit and a and integral to the application (e.g., del.icio.us) number of issues and requirements of corporate IT to • Creation and relevance of metadata: User-cre- implement and benefit from such solutions. ated metadata that improves the quality of the BI solutions have long provided decision makers data presented in the tools (e.g., flickr) with access to corporate data, such as product profit- • Composite applications and time-to-market: ability, customer profiles, and resource allocation. Applications created from services requiring only Access to such business intelligence is invaluable user interface (UI) development and minor busi- for strategic planning. However, using the tools that ness logic (e.g., most mash-ups, for examples see provide access to this invaluable information can programmableweb.com) frustrate users. Web 2.0 and, specifically, rich Internet applica- It’s important to note that the capabilities deliv- tions (RIA) solutions can provide features and quali- ered by Web 2.0/RIA solutions aren’t completely new. ties in Web-based applications that engage users in DHTML enabled many of the capabilities (if not all) ways flat HTML solutions can’t. In the Web 2.0 world, that we see in Web 2.0 applications; so what’s dif- users can escape the mundane, unproductive paper ferent now? AJAX and Flash provide a more robust or PDF report, and the mind-numbing exercise of environment to implement this type of functionality. manipulating Excel pivot tables. They’ll no longer Productivity on these ubiquitous, de facto standards have to generate custom reports from an enterprise is light years ahead of the DHTML world. This pro- reporting package or wait weeks for IT to generate ductivity and ubiquity have resulted in an explosive Langdon D. White is director of global the report for them. Instead, users point, click, drag, growth on public Internet sites and its emergence in engineering of architecture services for and slide through data presented in familiar Web 2.0 corporate solutions. Keane, Inc., a $1 billion business process widgets they use every day at sites such as Yahoo Mail and IT services firm with more than 10,000 Beta, Google Maps, and Outlook Web Access. In this Boosting User Adoption and Efficiency: employees. He manages a global team of type of environment, users can interact and collabo- Think “Interactivity” technical consultants and is responsible rate with the data, decorating it with commentary and In the corporate BI space, as with the public for the quality of all technical deliverables other metadata, and sharing it with a mouse click. Internet, increased user adoption and engagement produced by architecture services. Over the The Web 2.0 world enables users to access and can be achieved by providing user interfaces that past six years, Langdon has served in vari- compare a broader range of data, enables them to are visually appealing and task-oriented. However, ous roles in architecture services, including look more deeply at that data, and get the data they to make an application (or site) truly come alive R&D, consulting, and management. In each need sooner. Wasn’t this the original promise of busi- for a user, the application should also provide for of these areas he has overseen and partici- ness intelligence as a tool that supports business manipulating data, incremental user feedback, and pated in the delivery of many high-value managers and executives, helping them make more interactive components (e.g., finance.google.com). technical solutions for Fortune 100 clients, accurate and timely decisions? Such features aren’t possible in HTML, while others as well as delivered numerous technical This article considers how the following hallmarks are possible but not practical based on the number of industry talks and written many articles. of Web 2.0 can benefit BI and what corporate IT needs roundtrips required to update and render the data. lwhite@keane.com to do to implement such solutions. User adoption and efficiency is also increased by 44 March 2007 AJAx.SyS-coN.coM
  • task-oriented interfaces, since they let users be much letting a user correct the monthly revenue number more self-sufficient than traditional applications do to account for product returns. while requiring a minimum of training or technical • Comments on the perceived accuracy of the data. expertise. This is particularly compelling because cur- • Amendments to the information stored by the rent implementations of most off-the-shelf business system. For example, when a sales representative intelligence tools aren’t sufficiently usable for most misses their sales quota they can explain why. users to be able to leverage their full abilities. However, • Related links to the information presented. (This the failing is primarily on usability (not on technical can be particularly interesting since it may lead to ability) as most out-of-the-box BI solutions do allow a Semantic Web environment.) users to customize the data and the views of that data. Users providing feedback to the system can also Increasing User Participation: More Heads improve the searching capabilities of the enterprise. Are Better Than One For example, when users (or administrators) can Increased user involvement is also an interesting provide bibliographic-style information to a system phenomenon of Web 2.0 that may have a significant about its sub-components (or the new components impact on BI. Web 2.0 applications encourage users to they create), future users can search based on these submit metadata to applications. The data that users references. This minimizes the burden on the IT contribute to applications in the Web 2.0 space, while department to create these new “views” and increases not verified as accurate, is, nonetheless, providing the intelligence of the overall enterprise. significant new information to the data spaces that The storage of this information must be con- they contribute to. In the BI world, we can leverage sidered part of an overall user metadata solution. this same phenomenon to gather new “intelligence” Currently, there aren’t a lot of off-the-shelf solutions about the data we’re presenting to users. Specifically, to support this problem (if any), but many of the we can gather metadata such as: semantic tools and BI metadata repositories that • Corrections to the information stored in the ware- come with BI packages can be adapted as a solution. house or the enterprise data space; generally this The primary goal is to offer a “metadata service” appears as explanations for the data. For example, in the enterprise that allows application teams to Do you have a vertical market software product? Are you considering creating one? The Servoy ISV (Independent Software Vendor) Assurance Program offers ISVs a unique service to migrate from their current development platform to enterprise-level Java at a fixed cost and in a Your application AJAX and SaaS aware fixed timeframe. Rapid and efficient cross-deployment in 3 - 12 months. Guaranteed! (simultaneously) to Web, ✱ Cross Platform ✱ Cross Database Mobile and SaaS applications ✱ SaaS ✱ SOA -- complete with AJAX ✱ AJAX - Web 2.0 ✱ Office Integration capabilities -- is now possible. ✱ PDF & Acrobat Forms ✱ Multi-Lingual ✱ CMS ✱ Smart- and Web Client Call us now: (805) 624-4959 ✱ Fast Development ✱ Email Integration www.servoy.com ✱ Document Management ✱ Standards Compliant
  • submit information as well as search for it. The quently they prefer (hourly, daily, weekly). Leveraging implementation of the metadata repository, while current GPS-enabled cellular devices, systems can important, can generally be considered an imple- also deliver content that is location-aware (e.g., the mentation detail. current inventory of the nearest retail outlet). Further expanding the RSS infrastructure, an enterprise can Faster Time-to-Market: implement language and semantic translation on the New Rules of the Game content it supports as requested by users. The Web 2.0 world carries as a key tenet the con- tinuous improvement of applications (or the “per- Getting Started petual beta”). In other words, applications get many However, as with all good things, migrating to an incremental updates that have a minimal outage environment that supports a Web 2.0 world isn’t triv- impact on users. BI solutions, in particular, benefit ial. There are, however, two bright spots on this front. immensely from this kind of model where enhance- The first is that the press is already touting many ments are released quickly because the business intel- of the items discussed below and as a result, firms ligence of an organization is always changing, either may already be giving these projects higher priority because users come to new conclusions or because in the application queue. The other is that, as with a the rules of the economic environment change. This Service Oriented Architecture (SOA) initiative, an IT is in stark contrast to traditional BI solutions, which organization isn’t required to start from a “greenfield” are relatively slow to change, requiring IT involve- environment and can instead incrementally adopt ment for even the simplest variations on reporting. these techniques when implementing applications Even when BI tools claim to support the users without and pay only a small increase in cost for the project to involving IT, in practice that’s rarely the case and new contribute to the environment. functionality for the BI application must be priori- tized in the IT department’s regular queue. SOA as an Enabler A Service Oriented Architecture, while not Accessing Content: Anytime, Anywhere required, will make it significantly easier to adopt How do corporate users manage their inflow (the Web 2.0 principles. One of the core concepts of Web bombardment) of information in their personal lives? 2.0 is the idea of a “hackable environment,” meaning Any way they can. They read content bits on their that developers can quickly cobble together various phones and PDAs, print out articles and take them on components to create new applications. While not the train, and construct home pages on portal sites all SOA implementations leverage Web Services, they with channels of specific content. How can corporate are especially compelling to achieve the goals of Web IT help its users manage these information streams? 2.0, given their ubiquitous support from packaged Can corporate IT supply BI content and data through applications, development environments, and the similar channels to support its users better? Web-at-large. In addition, their tag- and text-based RSS (or Really Simple Syndication), which deliv- nature makes them easily “parsable” and “hackable.” ers data as an XML file or an “RSS feed,” can be To further encourage the development of unique, considered part of Web 2.0 if one applies O’Reilly’s user-centric applications, the enterprise should con- “Hierarchy of ‘Web 2.0-ness,” one of whose key char- sider adding non-business functionality via Web acteristics is that “the application could only exist on Services as well. Some examples include mapping the net,” not to mention the recent spike in popular- components, stock tickers/lookup, sales data from ity of RSS. Leveraged properly, RSS can be a solution other companies, and package tracking. Adding to the information overload problem by allowing these functions, either from the public Internet or by users to control the method and level of information acquiring software that provides them, may seem odd they receive. Specifically, IT can create an enterprise and non-business-related but allows IT to really start RSS feed aggregator that caches and publishes, for to think out-of-the-box about the kind of solutions it example: can offer to its users. • Popular and industry-specific feeds • User-created feeds to publish the information they Agile Methods & Lightweight Languages produce (e.g., document changes, internal blogs, A more lightweight development model benefits company news) the creation of Web 2.0 solutions immensely. Industry • User-created search feeds (i.e., feeds created from buzz suggests that agile methods are the only option for custom user searches that publish new results) Web 2.0, not, interestingly, the authors of the term (Dale Dougherty, Craig Cline), but in fact any short-release Each user can then customize the Enterprise RSS cycle software development technique can work. A infrastructure to deliver information to the device short release cycle, releasing at least every six weeks, (cell phone, e-mail, BlackBerry, printer) with the fre- encourages the perpetual beta and the continuous 46 March 2007 AJAx.SyS-coN.coM
  • Google is looking for engineers with great aspirations. If you’ve ever imagined being able to use your talent, education and skills to benefit millions of people around the world, Google might be the place for you. We’re looking for the brightest minds in engineering at all levels of experience – from recent grads to 20-year professionals. And we’re hiring in our offices around the world – from Zurich to Bangalore. One of our goals is to create the most inspiring work environment on the planet – a place where you can dream big and make things happen. If you’d like to be a part of that, we’d love to hear from you. Stop by our booth, and check out our current openings at www.google.com/jobs/ © Copyright 2006. All rights reserved. Google and the Google logo are registered trademarks of Google Inc.
  • “‘Lightweight languages’ are becoming significantly more popular as they turn into very robust enterprise-class environments for development.” improvement model demanded by Web 2.0 solutions. uptime or support for 30,000 users. In fact, user loads Agile methods can bring an enterprise signifi- and “mission criticalness” vary among applications. cant positive change. However, one should con- Recognizing these facts has allowed corporations to sider where to apply them and realize they aren’t consider these “toy” languages as what they are: robust an appropriate solution for every problem. Some environments, particularly for applications that value typical examples of inappropriate use include change over performance and stability. large projects (using in excess of 50 developers) or projects where the functionality required is clearly Conclusion articulated with a clear release date. However, The Web 2.0 world brings a number of potential the enterprise should seriously evaluate whether advantages for all applications, but business intelligence these kinds of projects are worthwhile (large proj- applications may benefit especially. However, increased ects often lose momentum before release) or exist user engagement and increased user participation don’t (clear requirements and dates have a nasty habit of come without cost, like implementing SOA and thinking changing over time) and consider redesigning the about development differently, but they should be well projects to fit an agile method instead. Experience worth it. The business intelligence derived from the Web has also shown that an agile method may be used 2.0 world leading to better, faster decision-making can on large projects by approaching the project from often have a significant, measurable ROI. an agile viewpoint. Unfortunately, there’s no clear The costs of migrating to a Web 2.0 world are also, way to tell when agile isn’t appropriate and the strictly speaking, not significant over the long-term. enterprise should, instead, start with small non- In fact, migrating to an environment that supports mission-critical applications and learn from expe- Web 2.0 better will decrease the cost of the overall rience how and when to apply agile techniques. enterprise over time. Much of the literature on SOA Another common failure of agile methods is the shows how to measure the ROI and the value of “cowboy” developer who doesn’t like writing docu- migrating to SOA. Web 2.0 is just another impetus for mentation and latches on to agile as an excuse. As investing in the enterprise. a result, an organization must develop or adopt an appropriate agile methodology and then ensure care- Interesting Links ful adherence to the method to avoid failure. • Google Finance, http://finance.google.com Along with agile methods, “lightweight languages” are • Baby Name Voyager, http://babynamewizard. becoming significantly more popular as they turn into com/namevoyager very robust enterprise-class environments for develop- • del.icio.us, http://del.icio.us/ ment. Most recent languages that are generally grouped • flickr, http://www.flickr.com/ into the “lightweight” category provide native (or “near- • Programmable Web, http://programmableweb. native”) support for Web services and rich Internet appli- com cations (primarily via AJAX). As a result, the Web 2.0 devel- • Yahoo Mail Beta, http://mail.yahoo.com opment leveraging these languages is especially efficient, • Google Maps, http://maps.google.com thereby allowing greater experimentation, which is a • Outlook Web Access, available with a deployed central component of the Web 2.0 world. Microsoft Exchange Server Recently, not just start-ups and individual Web sites, • Flash and Flex, http://www.adobe.com/products/ but mature corporations have also started to believe flash/flashpro/ and http://www.adobe.com/prod- that languages such as Ruby, Python, and Flash/Flex are ucts/flex robust enough to support their users. When corporate • Tim O’Reilly. “What is Web 2.0.” http://www.oreil- IT evaluates its portfolio of applications across different lynet.com/pub/a/oreilly/tim/news/2005/09/30/ classes of uptime and reliability, it finds ideal candi- what-is-web-20.html dates for such environments. In other words, not every • Tim Bray. “Not 2.0?” http://radar.oreilly.com/ application in the enterprise needs “six 9s” (99.9999%) archives/2005/08/not_20.html n 48 March 2007 AJAx.SyS-coN.coM
  • Scary Question. Exactly who is developing your next app? Contact Us Address: 555 Not My Home St. Big City, CO 12345
  • Your App Starts Here. We are the leaders in RIA development services. INCREDIBLE APPLICATIONS PASSIONATE USERS PROVEN SUCCESS Unlock your potential with the help of industry leaders in Rich Internet Application development. 10 Years. 1400+ Customers. Your app starts here. CYNERGYSYSTEMS.COM