Original URL: http://www.theregister.co.uk/2006/08/24/echo2_framework/

Echo2 versus GWT

Another toolkit that hides AJAX's implementation details

By John Hunt

Posted in Developer, 24th August 2006 13:29 GMT

A little while ago, I wrote about the GWT (Google Web Toolkit) here, which I'm particularly interested in as it provides a pure Java environment that can be translated into pure AJAX-style code.

This means that a Java developer can work with the GWT and create effective, lightweight, interactive websites without the need to get into how AJAX is implemented.

This column produced a great deal of correspondence from readers, a number of which highlighted other frameworks with similar aims. The Echo2 framework is of particular interest to me, as I've worked with its previous generation system.

In the remainder of this column, I'll briefly introduce the Echo2 framework and then provide a short comparison between GWT and Echo2, highlighting the strengths and drawbacks of the two approaches.

The Echo2 Framework

The Echo2 framework provides a web-based platform offering rich-client levels of capability and maintainability. It's a re-engineering of the previous generation of the Echo framework to take advantage of AJAX in its new rendering engine.

Echo developers create applications using a component and event-based API that resembles a rich-client user interface toolkit (think Java Swing). A rendering engine then generates the AJAX-style code required to render the user interface to the client browser.

To bring the experience closer to the standard of a thicker client, Echo2 uses an extensive library of client-side JavaScript that extends the capabilities of the browser. The architecture aims to remove the need for the end developer to think about the management of HTML, HTTP, and JavaScript, CSS etc. Indeed, the developer is completely insulated from that side of the system.

For further details of the Echo family (including Echo1) see here; Echo2 is here; and for EchoPoint (a collection of web components which integrates with the Echo Web Framework), see here.

Both Echo and EchoPoint are open source. Echo is released as open source by a company called NextApp; while EchoPoint is a collaborative effort coordinated via SourceForge.

The programming model adopted by Echo is intentionally Swing-like (with tables and table models and buttons and action listeners etc.) so that Swing developers should be able to move to Echo with the minimum of problems.

As an example, see the following very simple HelloWorld style Echo application. This application is comprised of two classes. The first is the HelloWorldServlet class. This class acts as an entry point for an Echo2 application. In essence, it's a standard factory that creates a new instance of the main Echo2 application - in the example; this is implemented by the HelloWorldApp class.


package com.reg.echo.hello;

import nextapp.echo2.app.ApplicationInstance;
import nextapp.echo2.webcontainer.WebContainerServlet;

public class HelloWorldServlet extends WebContainerServlet { 
        public ApplicationInstance newApplicationInstance() { 
                return new HelloWorldApp(); 
        } 
}

The main HelloWorldApp class is presented below:

package com.reg.echo.hello;

import nextapp.echo2.app.ApplicationInstance;
import nextapp.echo2.app.Button;
import nextapp.echo2.app.ContentPane;
import nextapp.echo2.app.Extent;
import nextapp.echo2.app.Label;
import nextapp.echo2.app.SplitPane;
import nextapp.echo2.app.Window;
import nextapp.echo2.app.event.ActionEvent;
import nextapp.echo2.app.event.ActionListener;

public class HelloWorldApp extends ApplicationInstance { 
        private Label label = null;
        public Window init() { 
                Window window = new Window(); 
                SplitPane pane = new     
                       SplitPane(SplitPane.ORIENTATION_HORIZONTAL, 
                                                       new Extent(215));
            pane.setStyleName("DefaultResizable");
                ContentPane contentPane = new ContentPane(); 
                contentPane.add(pane);
                window.setContent(contentPane); 
                label = new Label("Hello World"); 
                Button button = new Button("Next");
                button.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                                if (label.getText().equals("Hello World")) {
                            label.setText("Hello Echo World");
                                } else {
                                    label.setText("Hello World");
                                }
            }
        });
                pane.add(label);
                pane.add(button);
                
                
            return window; 
        } 
}

The HelloWorldApp is an extremely small application that is intentionally simple. However, from it you should be able to get a flavour of the AWT/Swing style of the Echo2 framework. In this class we have an init() method. This method creates a new instance of a Window (which is the object returned by the method). We then create a content pane that is added to the window, and a pane to hold our graphical components - a Label and a Button.

Note that the root of the Echo world is EchoServer, which must return an instance of EchoInstance. Each session has its own EchoInstance object. From this point on, everything is programmed in terms of Java classes such as Window, Label, Button, Table etc. Also note that to implement the button behaviour all I have to do is write a standard-looking ActionListener, which will toggle the message displayed by the label.

To deploy this example application we must create a WAR file containing the Echo2 library jars () and a web.xml file to define our web application to our Web Application Server (in my case, this is Tomcat).

Once this is done, I can reference the URL for the web application created by Echo and display the result as illustrated in Figure 1.

Figure 1: Shows the screen alternating between “Hello World” and “Hello Echo World” messages.

In Figure 1, this very simple screen alternates between a "Hello World" message and a "Hello Echo World" message each time the "Next" button is clicked, showing that the Java based classes presented above have been dynamically translated into JavaScript, HTML etc., as and when required.

The range of GUI components supplied by Echo2 is not limited to labels and buttons, of course; the full set includes components for:

In addition, the Echo2 Extras project adds TabbedPanes, Calendar Selector, Colour Selector, a Pull down menu component etc.

A range of other contributed libraries provides further enhancements such as:

Comparison with GWT

Echo is already an extremely interesting framework and the adoption of AJAX within Echo2 only improves its viability. However, in doing so it brings an obvious comparison with the AJAX based Google Web Toolkit (or GWT). In this section, we provide a comparison of the two approaches.

Java to AJAX frameworks

Both Echo2 and the GWT are frameworks that allow a developer to create a client within a purely Java world and then to deploy them to web clients supported by AJAX technologies.

Client-side or server-side

However, although both GWT and Echo2 rely on the use of AJAX, their approaches are quite distinct. GWT employs a Java-to-JavaScript translator that takes the developed Java code and translates it completely into a rich-client application using AJAX based technologies.

In contrast, Echo2 dynamically generates the client side elements on demand with all user interaction involving client-to-server communication. Both approaches work, but Echo results in more client-to-server communications, while GWT involves generating a completely new client - that will need testing just as much as the development version may have required testing.

In addition, with Echo2, none of the GUI logic resides in the client and only the current state of the GUI is sent to the client; while with GWT all the client GUI elements reside on the client. Note, in neither case does this limit the backend Java resources (or other resources) that the GUI accesses.

Open source or not

Echo2 is fully Open Source, and is distributed under the terms of the Mozilla Public License (or, if preferred, the GNU LGPL License). Thus, the code is freely available and you can modify, extend it, and work with it as required. In addition, a commercial company and a group of dedicated developers worldwide support it.

On the other hand, the GWT is not fully open source - some of its aspects are open source and others aren't. Notably, the Java-to-JavaScript cross-compiler is proprietary, binary-only software, although Google supports the GWT, of course.

Extensibility

Echo is easily extendable and once a new Echo2 component has been created, it can be used by everyone, without any need for others to learn the internals of Echo2. In contrast, developing new GWT widgets isn't as straightforward.

Summary

From my point of view, both Echo2 and GWT show the way forward in developing sophisticated web GUI applications using Java. At present, they have taken somewhat different approaches to the same problem, but which is better is rather a matter of opinion.

Personally, I would tend to consider using Echo2 if the application was based on an intranet (where its inherent client-server communication overhead won't matter much); but would probably consider GWT for an internet-based application (due to its greater support for a rich-client delivery platform). ®

References

The Echo2 Forum is here.
The Eclipse Plug-in for Echo2 is here.
Some Echo2 demos can be found here.