Introduction
Recently I began to play with Eclipse and web frameworks, because I will use Eclipse at work and there I will program with JSP. Another reason for this web-framework-survey is that I need a web front-end for my open source project Jetwick.
I love Swing so I looked how easy it is to program something useful with up-to-date web frameworks in comparison to Swing. For NetBeans support of several web frameworks (gwt, wicket, …) please look here.
The example I implemented in all frameworks is very minimalistic, but includes three basic components. The example offers a ‘Button’ to perform some gnuplot statements, which will be grabbed from a ‘TextArea’. On the server the statements will be performed (through gnuplot) and the user gets back the calculated image. E.g. if you type ‘plot sin(x)’ and click the button you will get the appropriated graph as an image within the web page.
I used the following statements for gnuplot and you can increase the isosamples to 100 to see what will happen if the respond of the server takes too long:
set xrange[-3:7] set yrange[1:5] set isosamples 50 set hidden3d splot exp(-0.2*x)*cos(x*y)*sin(y)
Just copy and paste this into the appropriate ‘TextArea’ of the application.
Why I chose gnuplot?
- it is free and available under linux and windows.
- it looks nice
- integration into LaTeX is best (good for scientists)
I used my simple class (see WebGnuplot package) to get the image from gnuplot, although there is a nice JNIBinding for gnuplot available at sourceforge.
Web Frameworks
I only chose the ‘most interesting’ frameworks, which are open source. The decision which one is interesting and which not was random. And I excluded frameworks where I need to program directly with Javascript. If you know other projects, where I can program in pure Java, then please let me know! Or ask me if you have suggestions or questions about the implementations.
Here is the list and how to access them in the example:
- Click Framework: http://localhost:8080/WGClick/ClickApplication.htm
- Echo2: http://localhost:8080/WGEcho
- Google Web Toolkit: http://localhost:8080/WGGWT/gwt/GWTApplication.html
- Java Server Pages: http://localhost:8080/WGJSP/HomePage.jsp
- Thinwire: http://localhost:8080/WGThinwire
- Wicket: http://localhost:8080/WGWicket/
- WingS: http://localhost:8080/WGWingS/app/
- ZK Framework: http://localhost:8080/WGZK/webgnuplot.zul
Click on the links to go directly to the web page of the product. Through this web framework comparison I have the feeling that there are some categories of frameworks:
- Swing like approach: Echo, Thinwire and WingS
- ‘Integrate components’ into HTML: Wicket and Click
- ‘integrate scripts’ into HTML: JSP, ZK (maybe better: ‘action based’?)
- compile Java to Javascript: GWT
Please help me here to use existent categories. Or this one and this.
Further Work
I will add some more frameworks in a later post. E.g. Struts, Stripes, MyFaces, Seam, SpringMVC, IT-Mill Toolkit and jZeno? Please make some suggestions here.
For some more Java web frameworks look on my own list, on java-source.net or on therightsoft.com. Or take a look at this nice comparison. .
Results
Swing
As the first step I created a Swing UI within 3 minutes – I will compare this later with the web frameworks.
Here is a screenshot of the result (It is not nice, but it was fast … and well, late):
Additional Information:
- User Libraries: ‘WebGnuplot’ (See the resources section)
Click Framework
Click is compareable to wicket, but it is slightly easier I think. It is a lot easier than JSP, because you don’t need getters and setters (i.e. an extra bean) – just the variable (e.g. form) which will be mapped to the HTML correspondent ($form), which is an identifier of the used scripting language (velocity). This means you haven’t to know the HTML specific components like in wicket, although it is a plus if you know them. It took me about one hour to get it running. I didn’t try the adapted Eclipse (clickIDE), but with this IDE you should easily edit the HTML file’s e.g. velocity support for the editor.
Here you can see the result:
Additional Information:
- It seems to me that click integrates very good with Cayenne. Cayenne is an object relational mapper (ORM) and a nice (easy!) alternative to e.g. Hibernate.
- I needed an extra servlet, which returns the image as an OutputStream.
- A nice page returns if an error occurs with a lot of details and the full stack trace.
- User Libraries: ‘Click’, ‘WebGnuplot’ and ‘Servlet API’ (See the resources section)
- License: APL 2.0
Echo
Echo was the first web framework I tried. It was very easy and fast to get it working (less than 30 minutes). The only big difference to Swing was the AwtImageReference class, which I had to use for displaying in the label. It is nice that a message window pops up (‘Please Wait…’), if the respond of the server takes too long.
Here you see the result:
Additional Information:
- User Libraries: ‘Echo’ and ‘WebGnuplot’ (See the resources section)
- License: MPL
Google Web Toolkit
The Google Web Toolkit works different compared to all other frameworks. So it took me a lot of time (5 and more hours) to get it working and understand what to do. I will explain the procedure now.
- You will have to compile the Java sources. Put the server side one into a sub-directory ‘server’ and the client side one into ‘client’. To compile the source you have to call ‘GWT-application-compile’ for this example. For the client side the compilation step generates Javascript sources from Java – to be executed on the clients webbrowser. And for the server side the Java code will be compiled and GWT generates e.g. the web.xml and some more files.
- Then you can run your application in a ‘normal’ browser, if you deploy the application to the server. But there is another mode, they called it ‘host mode’, where client AND server code run on the virtual machine (jvm). Then you can test your application directly within Java, which is very useful for debugging I think.
- For the interaction between client and server the GWT uses Java’s remote procedure calls (RPC). I will use it in the example, because the Image class does not support bytes or BufferedImage as input. So I send the gnuplot statements to the server (via RPC) and then the client reads the image from a separate ImageServlet (which knows the statements). This routine is a little bit complicate, but otherwise I wouldn’t use RPC and cannot show you how it works đ
Another concept of GWT is that you have to define ‘slots’ within the HTML files. From Java code you can access those slots via:
VerticalPanel vp = new VerticalPanel();
vp.add(button);
RootPanel rp = RootPanel.get("appSlot");
if(rp != null) { rp.add(vp); }
This makes it easy to integrate GWT in your current development. E.g. to enhance static content with some AJAX.
I got the following result:
Additional Information:
- User Libraries: ‘GWT’ and ‘WebGnuplot’ (See the resources section)
- GWT is a client centric framework
- It is possible to let GWT create you an Eclipse project if you want an easy access to compilation etc. (I didn’t try this…).
- There is a NetBeans plugin, which makes development very easy (without that I wouldn’t have figured out where my configuration mistake was…).
- You will have to replace the linux specific jar by the jar of your OS. But I don’t know how to generate a compile and a shell script for this specific project. Normally you would run the ‘applicationCreator’.
- I needed an extra servlet, which returns the image as OutputStream
- License: APL 2.0
JSP
JSP was (and is?) the standard technology for a lot of companies to create web projects. It works similar to ASP.
To get started it takes me only approx. one hour.
Here you can see the result:
Additional Information:
- User Libraries: ‘WebGnuplot’ and ‘Servlet API’ (See the resources section)
- I needed an extra servlet, which returns the image as an OutputStream
- License: APL 1.1
Thinwire
Thinwire’s last published version is relative old – maybe the authors skipped the development.
Update: This is not true. Look here and here.
I think it is easy to get started (approx. 50 minutes). Although I had some problems:
- You will have to set the bounds of every component explicitly – this makes it really ugly if it comes to computer generated interface (e.g. Strings withing Labels).
- It is not easy to display dynamically generated images to the client. Unlike echo and wings, we need here an ImageServlet for this work like e.g. in JSP and GWT.
- And I had to use the Button class to display an image, because the Image class does not work. This was the reason that it took relatively long to get it working.
Result:
Additional Information:
- If an exception raises you will get a window with the message and a full stack trace!
- User Libraries: ‘Thinwire’, ‘WebGnuplot’ and ‘Servlet API’ (See the resources section)
- I needed an extra servlet, which returns the image as an OutputStream
- License: LGPL
Wicket
In Wicket you will only be successful, if you know some basics in HTML. You will embed the components via HTML tags and access them from Java via id’s. Although it seems to be complicated I got it within one hour. Maybe that was because of the provided example from JFreeChart forum. I think Wicket will integrate well in existing environment based e.g. up on pure Servlets or JSP.
Result:
Additional Information:
- User Libraries: ‘Wicket’ and ‘WebGnuplot’ (See the resources section)
- License: APL 2.0
WingS
It was even a little bit easier than Echo to get started (less than 20 minutes), because there is a class SImageIcon which takes a BufferedImage as parameter in one of its constructors. So I haven’t to use the documentation – I just used auto-completion of the IDE.
You will get a typically ‘waiting cursor’, if the respond of the server takes too long. My feeling was that WingS was a little bit slower than e.g. Echo with the task of displaying the image after I pressed the button.
Here is the result:
Additional Information:
- User Libraries: ‘WingS’ and ‘WebGnuplot’ (See the resources section)
- License: LGPL
ZK
It took relative long to get started. 3 or 4 hours. Now I know the steps you have to do:
- You will have to understand how to create a zul file for your UI. But there is a demo application on the web site, where you can find a common usage of every component.
- You will have to understand how to get information from the client via Path.getComponent(“/zkWindow/error”); and
- how to push the results to the client via:
AImage image = new AImage(“Image”, bytes);
myimage.setContent(image);
But after understanding how zk works, it was easy for me to create the necessary classes and zul files. The default layout is very nice I think. But please look here for yourself:
Additional Information:
- User Libraries: ‘ZK Framework’ and ‘WebGnuplot’ (See the resources section)
- License: GPL or Commercial
Resources
You can find all examples as Eclipse projects here. All my code stands under public domain if not otherwise stated. So you can do what you want with them (I.e. for all purposes: commercial etc.).
Try the following procedure to get it working:
- Install gnuplot and adjust the command line in de.wg.core.GnuplotHelper e.g. for windows it is C:\GPpath\gnuplot.exe I think (I used linux).
- Then you will need a webserver (I used tomcat) and adjust the location of your webapps folder in all the build.xml files.
- Build the WebGnuplot project to create the jar in the dist folder (run the build task of build.xml) and change the location of this project in all examples (ant/build.xml).
- Build all the examples: just run all the ‘build’ ant tasks.
I splitted the examples into several eclipse projects to avoid conflicts (e.g. more than one project uses beanshell) and to compile them independently.
You will have to set up the user libraries for Eclipse to make auto-completion possible. You should put the project specific JAR-files into a subdirectory ‘lib’ of every project.
Define the following user libraries:
- WebGnuplot: WebGnuplot.jar
- Servlet API: servlet-api.jar e.g. from tomcat’s common/lib folder.
- Click: 1 file, 1.8 MB, version: 1.4
- Echo: 3 files, 0.457 MB, version: 2
- GWT: 3 files, 11.8 MB, version: linux-1.4.61
- Thinwire: 2 files, 0.481 MB, version: 1.2 RC2
- Wicket: 23 files, 8.2 MB, version: 1.3.2
- WingS: 5 files, 2.3 MB, version: 3.2
- ZK Framework: 31 files, 19.9 MB, 3.0.3
Maybe you have some usage from the following list, which is based on information from ohloh:
- Click with 1-3 developer
- Wicket with at least 4 developer
- GWT with at least 4 developer
- Thinwire with 1 developer
- Echo with 1 developer
- WingS at least 2 developer
- ZK Framework at least 5 developer
Please correct my assumptions if I they are wrong!
You can find a slightly modified version of this article on javalobby, where it is also possible post comments.
Conclusion
And the winner is …. my brain, hehe.
But which project is the best one? It depends! Do you need commercial support? Do want to integrate it into an existing project e.g. with a pure Servlet solution? Do you want to integrate the UI tests in your regular tests? And so on.
Try the examples or look into the source to get a feeling of ‘how to work’ with a specific framework.
I hope you will have fun!
Navigatone 
