I'm sitting in Patrick Lightbody's presentation on Leveraging AJAX in modern web frameworks. The point of this presentation is to give a preview of what's coming in Struts Action 2.0. There are a number of other good sessions I'd like to go to, particularly Intro to Dojo, but I figured it's better to attend this talk since AppFuse will be moving to SAF as part of 2.0. We're in a fairly small room, and there's about 20-30 people in attendance. With 400+ people at this conference, the other sessions are likely packed.
Ajax is more of a technique, rather than a technology. Commons Ajax techniques include:
- Tabbed pane
- Validation
- Polling
- Tree widget
- Voting
For SAF, there are three core building blocks/tags: <saf:div/>, <saf:a/> (results evaluated as JavaScript) and <saf:submit/>. Divs are where things "happen" and links/submit buttons can trigger events. There are two frameworks used is SAF:
- DWR: Remote invocation service for Java <-> JavaScript
- Dojo: Language/server-agnostic JavaScript framework
There are two styles of Ajax: DOM manipulation (DWR) and partial pages (Dojo). SAF provides three Dojo widgets: BindDiv, BindAnchor and BindButton. The div tag supports the following attributes: href, updateFreq, delay, loadingText, errorText, showErrorTransportText, listenTopics and afterLoading. A simple example is polling - where the remote action returns HTML:
<saf:div href="mailbox.action?id=%{id}" updateFreq="2000"/>
Advanced usage of this tag includes adding a <script> block to the returned HTML. It will be executed when rendered, just like normal JavaScript is.
Tabbed pane is another component that's made up of two tags: <saf:tabbedPanel/> and <saf:panel/>. Rather than specifying content/tags within an <saf:panel>, to use the Ajax version, you simply add remote="true" and href="remoteUrl" to <saf:panel>. I asked about remote="true" being redundant and Patrick agreed it should be implied when an "href" attribute is defined.
SAF also includes the ability to have topic-based events. Dojo supports an event system, which was originally donated by the WebWork developers. Any element, such as a div, may listen to multiple topics. Any element, such as an href or tab header, may notify a topic.
The last thing that Patrick is demonstrating is Validation using DWR. To use it, you will need to use SAF's Ajax theme, as well as have DWR installed and configured. The remote calls to SAF's validation engine return serialized objects rather than HTML "partials". By default, it uses onBlur events to do the validation and all that's required on the client-side is validate="true" on your <saf:form>. Another cool Ajax feature that SAF has is an OGNL Console that gives you a command-line interface to evaluate OGNL expressions.
Patrick's lessons learned from implementing Ajax into WebWork/SAF:
- Simple combinations of the basics can create powerful features, such as the tabbed pane or the tree widget.
- JavaScript inside an HTML block (<saf:div>) or as returned from an action (<saf:a>) can provide valuable glue code.
- The <saf:div/> and <saf:action/> tag have a close and important relationship.
- Understand the important differences b/w Ajax styles (DOM-based vs. snippet-based). Both have their places.
Pitfalls:
- Remember: there is no silver bullet
- At the end of the day, your application is still a web site - don't forget that
- Excessive polling can lead to extreme load and/or thread starvation
- Common functionality, such as the back button and printing, can become difficult or confusing for the user (Dojo can help solve this problem)
- Browser incompatibility can lead to two versions of the same application (see GMail)
The Struts Team hopes to release a preview release of Struts Action 2.0 this week or next, with a final release targeted for August.
