Java Desktop Network Components
Boosting Interactivity and Productivity at
the Same Time...
by Amy Fowler
June 12, 2003
This white paper provides an overview for a project
aimed at making developers more productive in creating
rich, responsive Web-enabled desktop clients using
the Java™
2 Platform, Standard Edition (J2SE™ platform).
The Interactivity Void
"Billions of dollars are wasted every year
in lost productivity as people wait for Web pages
to perform duties that could have been handled
better by a 1984 Macintosh-style graphical user
interface application."
— Dr.
Jakob Nielsen
The Web is revolutionizing the way we get work done
by allowing us to conduct business anytime, anywhere,
given access to a connected Web browser. The problem
is that the primary content delivered to browsers
is HTML, a markup language that wasn't designed
for implementing user interfaces. In the early days
of Web applications, users were so enamored with
the basic capability of accomplishing tasks from
their browser that they put up with the archaic "get
a new page on every click" user model. But the
Web isn't new anymore and for many applications,
users want the degree of interactivity they get with
traditional clients. Web application developers have
tried to mitigate the inherent limitations of HTML
forms by using technologies like JavaScript and dynamic
HTML to achieve higher degrees of user interaction,
but have discovered the end result to be unwieldy
and challenging to maintain as the complexity of
the application grows. There has got to be a better
option.
Reducing Round Trips
Filling the interactivity void boils
down to significantly reducing the server round trips
and associated page refreshes by offloading operations
from the server that can be safely and more effectively
handled by the client. A classic example is a Web
interface to view a large quantity of tabular data.
Thin clients dictate that the data be served up in
page-viewable chunks, and so when the user needs
to sort, filter, or search that data, a server round trip
and (worse) a page refresh is required. If the user
wants to directly manipulate the data, such as dragging
or resizing columns, forget it. This is an outrageous
waste of modern desktop machines, which have more
than enough memory and CPU power to store and manipulate
large quantities of data.
So, we want the ubiquity and convenience of applications
delivered from the Web, but we also want to maximize
our users' productivity by providing UIs that are
rich and responsive because server round trips are
minimized. Additionally, we want to ensure there
is a graceful path for extending these applications
over time, since after all, software evolution is
inevitable. What do we need to break the HTML browser
application juggernaut? Java.
Java Solves this Problem Today
The J2SE platform provides
all the required technology to create rich, responsive
desktop clients for
Web applications and Web Services:
- Rich
UI component set, 2D graphics, internationalization,
accessibility, and more
- Web deployment models for both browser clients
(applets, distributed via Java
Plug-in) and standalone applications (via Java
Web Start)
- Security
model that enables clients to be safely
downloaded from the network
- APIs for networking, threading, XML, databases,
and so on.
- Runs on all major desktop platforms: Windows,
Mac OS X, Solaris, Linux
- 7+ years of maturation in features, stability, and performance
The only catch is that building Web-enabled Java
desktop clients requires Java and Swing programming
skill and experience, and this leaves out a broad
range of Web developers whose expertise falls in
other camps. Fortunately, this issue can be addressed
by layering a new programming paradigm on top of
a strong base, which is precisely the goal of the
Java Desktop Network Components (JDNC) project.
High Level Components and
XML Simplify the Task
Swing provides an extensive UI class library that
enables programmers to create just about any UI imaginable,
from IDEs to slick visualization clients. Yet many
of today's client applications are primarily about
accessing, viewing, manipulating, and editing data
obtained in a standard format from a Web-based data
source. The task of assembling the UI components,
streaming the data from the network, and ensuring
the data display and manipulation is visually attractive
and optimized for usability requires an understanding
of Swing coding fundamentals (models, renderers,
threading rules, event handling, and so on). What many
developers want and need are higher level components
that leverage Swing and build in the smarts for
many of these common toils so that well-behaved clients
can be constructed more rapidly. Java Desktop Network
Components provides this component suite.
Very High-Level Beans
Each JDNC component is implemented as a first-class
JavaBeans™ component, exposing all universally required functionality
as simple properties and Actions. The initial component
set will include:
| Component |
Description |
Feature Highlights |
| Table |
view/edit tabular data |
scrolling, sorting, search, filter,
validation, print |
| Tree |
view/edit hierarchical data |
scrolling, expand/collapse nodes,
search, print |
| TreeTable |
view/edit hierarchical data with
node detail displayed in table rows |
scrolling, expand/collapse nodes,
search, print |
| Editor |
view/edit plain and styled text |
scrolling, simple style editing,
search, print |
| Form |
view/edit set of data elements |
type-appropriate edit controls, validation |
This list can of course be extended by allowing
third-party components to be plugged into the JDNC
architecture.
Built-in Data and Networking Smarts
These components will all have built-in data and
networking capabilities. They will support both local
and remote data sources and will be able to deal
with commonly required data formats, such as JDBC
rowsets and XML, while clearly defining plug-in points
to accommodate the idiosyncratic needs associated
with getting data into applications. They'll handle
the problem of using threads to stream in the data
without blocking the UI (doing this correctly using
threads is a nontrivial task) as well as the business
of creating and installing the Swing models . For
the majority of applications using JDNC, developers
will only need to specify the properties associated
with obtaining the data (source, format, and so on) and
declare how the UI components should bind into that
data model, because the components handle the complex
details.
Leveraging XML for Configuration
The next requirement is to bring this functionality
to the fingertips of markup developers. JDNC defines
a simple XML schema for configuring JDNC components
for desktop clients. What sets this apart from other
XML-based UI technologies is that it is neither a
toolkit-level markup language, such as XUL, nor a
general purpose markup language for Swing, such as
SwingML. This is not to say that these technologies
do not have their place, but the primary design goal
for JDNC is simplicity. The JDNC configuration schema
sits at the application level, which enables developers
to more quickly construct Java desktop clients precisely
because the schema is less complex. It leverages
Swing, but does not require the developer to have expertise
in either GUI programming or Swing.
The schema will enable a solid range of sensible
layout capabilities without providing the infinite
layout options of layout managers. Does this mean
that some clients cannot be constructed using JDNC?
Yes, and that's exactly the point. JDNC guides the
developer by narrowing the choices to a well-honed
subset of what's possible. Those who need finer control
and flexibility can already use Swing or one of the
general purpose markup languages to build just about
anything.
Browser or Standalone
Deployment
JDNC supports both Java Web deployment models:
- Applets deployed in browser-based clients using Java
Plug-in software.
In this scenario, JDNC can be used to dial up the
interactivity of HTML clients by embedding the components
in selected areas of a Web page. For example, the
JDNC Table component could be used instead of a static
HTML table to enable a user to view/sort/filter a
large quantity of tabular data without forcing constant
server round trips and page refreshes. In this model,
the developer simply needs to use the <applet> tag
to embed the JDNC table component in the page, and
then write a simple XML configuration file that
tells the component where to get the data and how
to display it. Note that this is distinctly different
from the original applet paradigm, which required
developers to author the UI source code themselves.
This is what makes JDNC a "component" rather
than a "class" library. Applets make it
possible to integrate this technology into existing
applications. If you're haunted by any 1996/1997
memories of applets, you should look again — seven
years of steady improvement have made them ready
for prime time. In fact, this technology makes it
really easy to try it out with minimal investment.
JDNC components can be used to construct standalone
clients that are Web-deployed using Java Web Start
technology. As in the applet deployment model, the XML
configuration file can be used to declare the application's
data model, the UI, and how the UI binds to the data
model. However, in the standalone case, layout becomes
a more central requirement since there is no surrounding
HTML to handle that task. As mentioned previously
in the section on XML configuration, JDNC will provide
sufficient capability to quickly achieve most standard
application layouts (with menu bar, tool bar, split and tabbed
views, status area, and so on). When building a new client,
it's important to understand that a client that
is both deployed-from and connected-to the Web does
not have to live in the browser, and in fact for
one that is used intensively by its users, it shouldn't
be. JDNC is designed to make non-browser-based clients a more palatable
option for developers who are largely markup developers.
A Simple Example
To illustrate this technology, we'll take a glimpse
at a very simple example. Say we have an HTML browser
application used to view bugs (something all us developers
understand). Since often the quantity of bugs
is large, we want to display these bugs in a rich
table that is scrollable and supports sorting, resizing,
and rearranging of its columns. We'll do this by
using the JDNC Table component as an applet embedded
in our bug viewing Web page. The developer simply
authors the <applet> tag and writes
the XML configuration file, and the JDNC Applet worries
about instantiating the appropriate Java objects
to build the interactive table component. The diagram
below depicts this graphically:
Diagram
of JDNC Bug Table Example |
Now let's look at it a little more closely, from the developer's
point of view.
Embedding the Applet
The developer uses the <applet> tag
to incorporate the JDNC Table into the Web page,
allowing the surrounding HTML to handle the layout.
The "config" applet parameter is set to
point to the XML configuration file for this table
component:
<applet name="JDNCApplet" archive="table.jar, common.jar"
code="com.sun.jdnc.JDNCApplet.class"
width="800" height="300"
align="middle">
<param name="config" value="bugtable.xml">
<param name="boxbgcolor" value="255,255,255">
</applet>
Authoring the XML Configuration File
The developer authors the XML configuration file "bugtable.xml" to
configure the data and table display properties:
<?xml version="1.0"?>
<jdnc-app>
<data id="bugdata">
<source url="bugs.txt"/>
<format mimetype="plain text">
<columns>
<column id="bugid">
<link>
</column>
<column id="priority">
<integer minimum="1" maximum="5"/>
</column>
<column id="date">
<date format="EEE MMM dd HH:mm:ss z yyyy"/>
</column>
<column id="state">
<string>
<values>
<value>dispatched</value>
<value>fixed</value>
<value>closed</value>
</values>
</string>
</column>
<column id="synopsis"/>
<columns>
</format>
</data>
<table id="bugtable" sortable="true" draggable="true" grid="true">
<statusbar/>
<rows margin="20">
</rows>
<columns>
<column dataref="bugdata.bugid" label="BugID" alignment="center">
<sample>8888888</sample>
</column>
<column dataref="bugdata.priority" label="Pri">
<sample>1</sample>
</column>
<column dataref="bugdata.synopsis" label="Synopsis" editable="true">
<sample>This bug is bad and I want you to definitely fix it!</sample>
</column>
<column dataref="bugdata.date" label="Dispatched">
<format>MMM dd, yyyy</format>
</column>
<column dataref="bugdata.state" label="State" editable="true" alignment="center">
<sample>dispatched</sample>
</column>
</columns>
</table>
</jdnc-app>
Configure the Data Model
This example illustrates how the data model, "bugdata",
is configured independent of the UI elements. The <data> element
specifies everything JDNC needs to know to access
that data (source, formatting params, type information,
validation constraints, and so on). In this simple example,
when the page including the applet is requested,
a servlet makes a database query and generates a
simple text file, "bugs.txt",
containing the tabular data.
Configure the UI and Bindings to the Data
The Table UI component, "bugtable",
is next specified using the <table> tag
and includes display-specific information and bindings
describing how the data should be mapped into the
table. The JDNC table component will automatically
tune its cell display and editing based on the information
provided in the <data> tag. For example, since
the "priority" column defines minimum and
maximum values, the table will provide a combobox
for editing cells in that column, rather than a numeric
textfield. Note also that the columns are not displayed
in the same order as they were defined in the "bugdata" element
and that the "date" is displayed
with a format different from the format that
was provided in the text data file. This separation
makes it vary easy to customize the display of the
data independent of its source, as well as providing
flexibility in how the UI components are bound to
the application's data model. Multiple UI components
may well reference into the same data model to provide
alternate views or editing mechanisms.
Understanding the power of XML, it's easy to imagine
how much can be customized using this configuration.
Ultimately the schema will allow for specifying conditional
display (for example, if priority = "1", display
the background in red), as well as the necessary
hooks for adding event handling and behavior to the
UI. We'll leverage standards in the schema whenever
possible, provided they don't compromise this technology's
ultimate goal of simplicity and ease of development.
This example shows a work in progress; the JDNC schema
design has and will continue to evolve significantly,
which brings us to the next topic.
Community Involvement
When it comes to understanding the challenges inherent
in building real world applications, no one is more
knowledgeable than the application developer himself.
In order for a technology like Java Desktop Network
Components to succeed, it will need to be nurtured
and shaped by a community that includes those who
use it to produce world-class Java desktop clients.
The timely arrival of the new community Web site, javadesktop.org,
provides just the place to host the evolution of
this project under an Open Source development model.
Currently a team at Sun that includes Swing engineers
and some outside application developers is busy building
an early access version of the JDNC technology. Once
we reach this early access milestone (targeted for
Fall 03) we'll roll it out as an Open Source project
hosted on javadesktop.org. From there we'll look
to the Java desktop development community for contributions
aimed at improving the design and implementation.
The details are still being worked out, so please
visit the javadesktop.org Web site in the future for
updates on the status of this project.
Conclusion
The excitement of the Internet has swung the pendulum
significantly too far in the direction of delivering
HTML-based user interfaces in the browser. Users
are frustrated over the underwhelming user experience
and productivity lost as a result of using thin clients
everywhere for everything. It's time to swing
the pendulum back to some rational midpoint where
choosing between HTML browser clients and more traditional
UI clients is based on the user's needs, rather than
a desire to have an easy Web deployment model. The
emerging world of Web Services means we'll have standards
for accessing data from the Web without embedding
it in the presentation, as HTML clients do. J2SE technology
offers the best of both worlds: rich, robust APIs
for creating interactive clients, and Web deployment
models that support both browser-based and standalone
application clients. The Java Desktop Network Component
technology just makes J2SE technology easier for a broad base
of developers to embrace. Java is on just about everyone's
desktop, so let's use it.
References
Read
or Post
a Comment
|
