Review: Macromedia Flex
Summary
Finally J2EE developers have a decent rich client development
platform. Well, we almost do. Macromedia's new Flex offering -
currently in Beta - looks to serve up a native J2EE rich
Internet application development platform that uses the
ubiquitous Flash Player as the rich client. Flex offers an XML-
based scripting language that compiles Flash applets on the fly
and can call on remote Web Services, EJBs and other Java
objects. Component-based? Yes. Extensible? Yes. Customizable?
Highly. Standards-based? Yup. Worth looking into? Definitely. More
Information
Introduction
A lot was going on this year's MAX, Macromedia's annual
developer's conference, last month, but the talk of the show was
undoubtedly about Macromedia Flex. Currently in Beta, Macromedia
Flex is a server-side offering that enables developers to deploy
a rich client presentation layer using XML-based code. Simply
put, Flex works much in the same way a JSP container does, only
it compiles the script (currently referred to by its code name,
MXML) into Flash clients instead of an HTML interface. The end
result is a highly-customizable rich client interface that can
be easily integrated and deployed in existing J2EE applications.
Plus, Flex is 100% native Java and will be deployable in the
major J2EE application servers, and even Apache Tomcat (there
are plans for a .NET version in the future, as well).
The Case for Rich Clients
I have discussed this previously (see my Canoo
ULC review), so I will do so only briefly here. The reality
is this: HTML-based interfaces are clunky. Client-side activity
and validation is unpredictable (Is JavaScript enabled? Does the
client have a JVM to execute an applet?). Forcing entire page
refreshes to simply send and receive a small piece of data is
extraneous. In the end, the application and all of its users
ultimately suffer. By integrating a richer client that is
component-based, allows for a client-side data model (and
client-side data interaction) and has the ability to call on
remote services, we can develop applications that perform
significantly better both in terms of utilizing client and
server processing (HTML-based applications rely too heavily on
the server) and in terms of fulfilling business objectives with
our applications by providing better interaction.
Flex Overview
Flex utilizes Macromedia Flash Player to provide it's rich
client interfaces. Macromedia Flash is a natural for the client.
It is just about everywhere 98% of computers on the Internet
have it. In the past couple of years, Macromedia has evolved
Flash to incorporate a component architecture, standardized
ActionScript to ECMA and provided XML parsing capabilities. In
short, Flash has moved from a simple animation tool to a robust
rich client development platform.
Even with these enhancements, traditional Flash development
still doesn't easily fit into the J2EE development cycle very
well. Client development must be done from within the Flash
development environment, calling on Java objects and EJBs
requires additional work and software (Flash Remoting) on the
server, and learning Flash development requires time.
Personally, I have found the traditional Flash development
paradigm odd and unnatural, at least from a server-side
programming standpoint. The timeline format is somewhat awkward,
understanding where to put scripting and where to find it is
somewhat confusing. It just doesn't make sense from a J2EE
developer's standpoint. With Flex, however, it isn't necessary
to use the Flash development environment. Developer's can simply
use the MXML language, along with ActionScript, and Flex will
compile the Flash application at runtime. This makes a lot of
sense to me. Now I can easily develop and then deploy MXML (and
thus Flash) files with my WAR and EAR files. There is even a
custom tag that will allow developers to embed MXML scripts
within JSP pages.
Components and Behaviors
Any rich client tool has to have a component model. The ability
to reuse common components like drop-down boxes, data grids,
trees, tabs and other UI elements is key. Additionally,
developers will need to be able to customize these components to
match their own layouts and also develop their own components.
Flex has a slew of pre-built components in both types of Flex
components: containers, which control layout in the
Flash Player drawing surface, and controls, which are
user interface components. Additionally, developers can extend
these pre-built components or create their own using Flash or in
MXML.
Flex also includes a number of pre-built behaviors.
These behaviors are effects that are triggered by events within
the Flash player environment. For example, a behavior might
trigger a sound to play when the user clicks on a button.
Customizable Interface
There are a number of ways to tweak the look and feel of Flex
applications. Flex supports cascading style sheets, which means
developers have the option of using their existing style sheets
for their rich Internet applications. Components have a skins
properties that allow for easy alteration of their appearance. A
particularly cool feature of Flex is its support of Scalable
Vector Graphics (SVG) for rendering vector-based images and
backgrounds from XML files.
J2EE/Standards Back-end
While a rich client interface allows for additional data and
logic on the client side, the core business logic will
invariable still reside on the server. Flex utilizes standards
to call remote methods. Flex can call on SOAP-based Web
services, Plain Old Java Objects (POJOs) and Enterprise
JavaBeans (EJBs). For the J2EE developer, this is important.
Flex Development
Developing rich client applications should be seamless for the
J2EE developer, this being a simple yet robust language and a
good IDE. In the case of Flex, the MXML language is a
straightforward tag-based language that can be supported with
ActionScript's object-oriented scripting. Developers have a
choice of development environments.
IDE Integration
Brady is the code name for a Flex development environment, also
currently in Beta. Brady is essentially a version of Dreamweaver
MX that includes support for MXML tags. However, I suspect that
most J2EE developers will not be using this, however, and will
instead opt for the Eclipse plug-ins currently in development in
partnership with IBM. Also, because MXML is XML-compliant, any
XML editor that supports schemas will support it. This includes
popular XML tools such as Altova xmlspy, IntelliJ IDEA and
Borland JBuilder, among others.
MXML
Let's take a look at the heart of Flex: MXML. The following code
snippet is taken from the Macromedia Flex preview
site:
<?xml version="1.0" encoding="iso-8859-1"?>
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml">
<mx:WebService id="wsStock"
wsdl="
http://services.xmethods.net/soap/urn:xmethods-delayed-quotes.wsdl">
<mx:operation name="getQuote">
<mx:request>
<symbol>{symbol.text}</symbol>
</mx:request>
</mx:operation>
</mx:WebService>
<mx:Label text="Enter a symbol:"/>
<mx:HBox>
<mx:TextInput id="symbol"/>
<mx:Button label="Get Quote" click='wsStock.getQuote.send()'/>
</mx:HBox>
<mx:Label id="quote" fontWeight="bold">{wsStock.getQuote.result}</mx:Label>
</mx:Application>
The results of this code can be seen in Figure 1.
You can see this XML code uses XML namespaces to declare mx as
the tags. The root element is the mx:Application tag. The
mx:HBox tag is used for layout purposes, mx:TextInput and
mx:Button are form elements. mx:Label indicates where text will
display. Pretty straightforward. Binding data is done using the
curly brackets, e.g. {symbol.text} will output the text input in
the symbol text input field. The mx:WebService tag
performs a WSDL lookup on a remote Web Service. This is
processed when the button is clicked. Note the behavior entered:
click='wsStock.getQuote.send()'. This seems like a
highly intuitive implementation at first glance. I look forward
to getting deeper into the beta.
MXML includes intuitive methodologies for designing layouts,
building UIs, performing validation and all of the important
tasks that will be necessary in building rich client
applications.
ActionScript 2.0
Finally, Flash's ActionScript 2.0 is fully supported by Flex.
This means that developers have an object-oriented way to add
granular functionality to their rich client applications. This
can include anything from client-side business logic and flow
control and more. Because is it based on the ECMAScript
standard, ActionScript should be easy for Java developers to
adopt.
Conclusion
Overall, I'm really excited about this new software. It is
unquestionable that HTML-page based applications will be
replaced by richer clients. I think it's about time that J2EE
developers have a decent platform for rich client development -
one that is component-based, extensible, intuitive and can be
edited from within the development environments we are all used
to. Macromedia's commitment to standards - CSS, XML, SOAP, SVG,
etc. - is a welcome approach. Clients will have to have the
Flash plug-in, but given its widespread usage and relatively
small download size this seems a minor consideration. The only
downside is that this product is currently only in Beta. Anyone
interested in participating can apply at
Macromedia.com. Happy Holidays and see you next month.
New on the Java Boutique:
New Review:
Time Management Made Easy with the Quartz Enterprise Job Scheduler
Why not just use the Java timer API? This open source scheduling
API boasts simplicity, ease-of-integration, a well-rounded feature
set, and it's free!
New Applet:
Reverse Complement
Reverse Complement is a simple applet that converts DNA or RNA
sequences into three useful formats.
Elsewhere on internet.com:
WebDeveloper Java
Lots of Java information on webdeveloper.com
WDVL Java
Thorough Java resource at the Web Developer's Virtual Library.
ScriptSearch Java
Hundreds of free Java code files to download.
jGuru: Your View of the Java Universe
Customizable portal with online training, FAQs, regular news updates, and tutorials.
| 
