Friday, May 04, 2007

Interaction Sequence Diagram for Google Web Toolkit

I've been doing some work with Google Web Toolkit. GWT is based on a cool model where the client-side and server-side code are both written in Java. The client-side code follows certain API guidelines which allow it to be compiled to optimized Javascript by GWT. Among the APIs that can be used is a pattern for asynchronous remoting, so that AJAX calls can be made and received in Java, with Java objects as arguments and return values (a bit like RMI). The marshaling and unmarshling, JSONizing and the like is done automagically. Nikhil Kothari has a similar technology on the .net side that lets you code client-side Javascript via C#. It is called Script#.

This model has a number of major strengths. But one weakness is that is not common, so it is not immediately familiar to developers. The interaction pattern can seem a little mysterious even with Google's doc set, debugging tools, etc. It gets more interesting when you consider that you might also be generating the original pages (the ones with AJAX interactions on them) via Java. (GWT does not require a dynamic page generation scheme at all, and can use static HTML.) In order to make this clearer, I wrote a sequence diagram which I'm posting because it may be valuable to other developers getting their heads around GWT.

The diagram shows three interactions. First, I'm generating my initial pages using the FreeMarker templating system. There are lots of other ways (like JSP for example). But here I'm using FreeMarker. This all takes place before GWT gets involved in the pages.

Next, I show how the GWT scripting gets running and loads the page specific code which will rewrite the DOM. At the end of this, the page is rendered the way the user will see it in the browser.

Last, I show how an AJAX interaction flows, including a call to an external web service on the back end -- e.g., if there is a "Load My Favorites" button on the page that results in a call to an external service and asynchronously returns with data to bind into the DOM.

I hope it's helpful. If I've left anything key out, let me know.

Click to enlarge / view:


Runescape Gold said...

I recently came across your article and have been reading along. I want to express my admiration of your writing skill and ability to make readers read from the beginning to the end. I would like to read newer posts and to share my thoughts with you.

Runescape Gold
RS Gold

Cheap WOW Gold said...

it looks like you had a much more fabulous weekend than my own! ha ha, i spent it studying for finals. ughhh.
lovely blog, by the way!

Seacanoeist Mark said...

I liked your article, I will share your article to everyone!!

WoW gold|Diablo 3 Gold|RS Gold|Cheap Diablo 3 Gold

Wright Petter said...

Hi, Great.. Tutorial is just awesome..It is really helpful for a newbie like me.. I am a regular follower of your blog. Really very informative post you shared here. Kindly keep blogging. If anyone wants to become a Java developer learn from Java Training in Chennai. or learn thru Java Online Training from India . Nowadays Java has tons of job opportunities on various vertical industry.