Lombardi Blueprint, built with GWT

Posted by Tom Stocky - Tuesday, October 16, 2007 at 10:41:00 AM

We wanted to highlight another success story for GWT. Lombardi Software has created an innovative modeling tool called Blueprint that they recently built using GWT. Rather than having me tell the story, here are the details from Alex Moffat, Engineering Manger at Lombardi:

Lombardi Blueprint includes around 28,500 lines of our Java code that gets compiled to JavaScript by GWT. We think that's quite a lot but the largest page is 50% smaller, at 480K, than the less functional Dojo based prototype, and it was much easier to develop.

The challenge handed to us was to create a tool that the average business user could use to document and manage their business processes. It had to be easy to use, encourage collaboration between team members, and provide a shared repository for all of a company's process documentation. Workflow functionality had to be on par with our competitors: Microsoft Visio, IDS Scheer's ARIS, IBM's WebSphere Business Modeler, and other desktop modeling tools. But we also wanted wiki & shared whiteboard capabilities to store information. Editing should use the drag and drop interaction users of desktop apps are familiar with. We ended up with some additional features that really set us apart:

  • An intuitive map view as a high level visualization of a process
  • Automatic workflow diagram generation
  • PowerPoint generation for easily presenting the process
  • Online chat functionality

All that was a significant task for us to tackle and without GWT we wouldn't have accomplished it. It turned out that coding in JavaScript just wasn't an option for such a complex application. If you're developing a browser based app we'd highly recommend using GWT. And we've seen great success, with thousands of users in Fortune 500 companies around the world. And opposite the Web 2.0 / Enterprise 2.0 concern, users actually pay for our app!

(see the larger video)

Back when we began developing Blueprint, we started with a combination of HTML and Flash 8 for the interactive parts. We ended up abandoning that fairly quickly for a couple of reasons:

  • Flash is a plug-in. Even in this day and age, not everyone has the latest version of Flash installed on their machines. Lots of our users are at big corporations where their boxes are locked down tight enough that installing/upgrading browser plug-ins is a nonstarter.
  • Browser plug-in behavior is unpredictable. Weird browser interaction bugs made cross platform Flash support harder than we thought.

Our next iteration was pure HTML and JavaScript using Dojo. This approach fixed the problems we had with Flash, but had its own issues:

  • Execution speed and network performance. Dojo is a great and full featured framework, but that's a double edged sword. When we were done, we were including a JavaScript library on every page that was over a MB and a lot of that was dead code.
  • It felt like a black box. While Dojo is open source, without a good debugger it was very difficult to figure out what was going on under the hood. We got pretty good at using firebug and venkman with Firefox but that still left IE and neither solution was terribly easy to use.

Around that time, GWT 1.3 was released and we decided to take the plunge. Fortunately we didn't have to convert all of our JavaScript code to GWT at once. By using GWT's JSNI facilities, we were able to migrate areas gradually as we needed to make functional changes. Compared to our earlier efforts, GWT has allowed us to be far more productive and flexible. The big wins for us have been:

  • Great tooling. The fact that you can develop a GWT app using Eclipse or IntelliJ and use their refactoring support is huge. Whereas with the pure JavaScript solution we never did even simple changes like renaming methods for fear that we'd break things, now we can do that and far more aggressive changes with confidence.
  • Massively improved debugging. Hosted mode debugging is wonderful.
  • Elimination of memory leaks, especially in IE6. While the circular reference leak in IE6 was partially fixed in July with Microsoft security bulletin MS07-033, many of our clients (corporate users) have not installed it yet. Using GWT means the generated JavaScript code doesn't include the leak producing patterns.
  • Easy browser specific code. While GWT does a good job of hiding browser differences from us in most scenarios, there are always edge cases that we have to handle with our own code. GWT makes it really easy to add browser specific code and have that code only be served up to the appropriate browsers.
  • Code size and execution speed. The amount of JavaScript that we serve up on each page is far less with GWT. We're down to about 480K with GWT 1.4 for our largest page from over a MB since GWT compiles in only the code we need. In addition GWT 1.4 produces JavaScript that is about 70% of the size of the GWT 1.3 output for our pages, and the compilation process is about twice as fast. That's a nice benefit to get for what's turning out to be a very easy upgrade for us.
  • Unit tests. GWT makes it easy to run unit tests on our client side code without having to launch a browser. Testing the visual appearance of the screens still needs other solutions though.

Line count comparisons between the Dojo and GWT based versions of Blueprint are invidious, not least because the GWT version of Blueprint includes much more functionality than the Dojo based one did. However, for our last Dojo based release we wrote around 8,500 lines of JavaScript, and at this point we've written 28,500 lines of Java code, excluding comments, which GWT compiles to JavaScript. There's no way we could have built the equivalent functionality using JavaScript, and as mentioned before the resulting downloads are still smaller.

Overall we believe GWT has enabled us to write a much more reliable and efficient application and build it faster than we could have otherwise. Since its release just 120 days ago, people in 60 countries have begun using Blueprint; this represents more than 750 companies and thousands of individuals. You can check it out for yourself and let us know what you think!

No comments: