Why GWT? Advantages and Trade-Offs of Using This RIA Framework

Question

I've been reading through a bunch of the "highest voted" questions for GWT. Several of these questions talk about the pitfalls or problems with GWT.

In the articles: Which Javascript framework (jQuery vs Dojo vs … )? and Biggest GWT Pitfalls?, some posters seem to suggest that GWT is not lightweight enough or that there are better alternatives that may be used.

Do most of you feel that there are problems with GWT that have not been fixed with GWT 2.0 -- which would make you inclined to suggest using a simpler framework for a new project?

To some extent, shouldn't GWT be somewhat future-proof (since you don't have to worry about it changing drastically from release to release and since it is backed by Google)?

I realize that the answer to this question depends greatly upon what you want to do or what you wish to make. I am looking at this from the perspective of starting a new web application that will eventually be used by millions of users.

Answer 1

Trade-offs

Let's start with all the trade-offs I can come up with:

• you're using Java - it means that your webdevs' proficiency in javascript won't come in handy as much (it will be helpful if you dabble in JSNI)
• problems with indexing by search engines - IMHO, this should be the biggest disadvantage of using GWT, or pure JS web applications in general. Since the content, layout, everything is created "on-the-fly" with JS, the search engine will only see a very short HTML page and that's that - you have to take care of this somehow yourself (for example, using cloaking). Google has finally started to work on a solution for this, however it doesn't seem to attractive to me.
  Update: Google has finally addressed this problem. However, I'll leave this as a trade-off because making the application crawable still requires more effort than in other frameworks. At least now we have a "standard" to follow and don't have to use some dubious techniques (like cloaking).
• it's easy (especially for a beginner in GWT, especially when that person comes from a HTML/JS background - without too much object-oriented experience) to go all "wow, these 'object' things are so cool, let me make all my <div>s into separate objects, that will make the code all nice and neat". Of course, I'm over-exaggerating it, but you get the point - it's easy to imagine that an unexperienced programmer could put a full-blown Widget with lots of Handlers in every cell of a FlexTable... And then (s)he'll waste a lot of time wondering why the application feels sluggish ;) tl;dr: it's easy for beginners in GWT to make their applications "bloaty" by writing code that seems in line with what the documentation/samples/common sense ;) suggest

That's all for the trade-offs I can think of - if anyone wants to add something, please add comments.

Advantages

Now for the advantages. I'm gonna skip some like internationalization, cross-browser compatibility for free, easy integration with other Google's libraries, etc, because they are kinda obvious and easy to grasp. I'll try to focus on the less emphasized but still very important features:

• the compiler - now, most people I've talked with about GWT doesn't realize just how amazing this part of GWT is - for starters try this presentation from last year's Google IO. The compiler has the view of the whole application.

So it can optimize such a something like this:

public class ShapeExample implements EntryPoint {
  private static final double SIDE_LEN_SMALL = 2;
  private final Shape shape = new SmallSquare();
  public static abstract class Shape {
    public abstract double getArea();
  }
  public static abstract class Square extends Shape {
    public double getArea() { return getSideLength() * getSideLength(); }
    public abstract double getSideLength();
  }
  public static class SmallSquare extends Square {
    public double getSideLength() { return SIDE_LEN_SMALL; }
  }
  public void onModuleLoad() {
    Shape shape = getShape();
    Window.alert("Area is " + shape.getArea());
  }
  private Shape getShape() { return shape; }
}

..to this:

public class ShapeExample implements EntryPoint {
  public void onModuleLoad() {
    Window.alert("Area is 4.0");
  }
}

And then obfuscate this and minimize. Additionally, this is done in such way, that makes the resulting files more compressible via gzip.

• you're using Java - whether or not you like Java, there's no denying that it's a very good object-oriented language, that allows to write easy to maintain and testable code (something I don't think is possible to such extent with JavaScript). If you follow some good guidelines, you'll arrive at a code that is understandable not only for you, but for other developers as well. Another thing worth mentioning is that all those nice design patterns, etc, that work in "pure" Java, work here too.
• one nifty thing about GWT is that you get performance gains and new features for free with almost every new release of the framework. Since it's Java compiled to JavaScript, it takes only a recompile to benefit from the optimizations made in the new compiler or get new features (like the accessibility support introduced in GWT 1.5).
• debugging - it is worth mentioning that you can (and should :)) debug your GWT apps just like any other Java application, using your IDE's debugger. And, in general, the Java debuggers I've seen are more advanced then their JavaScript counterparts.
• UiBinder - while it's still not "perfect", UiBinder let's you design your Widgets in an easy and intuitive way using XML (as opposed to the pre-2.0 way that forced you to do this in Java). Mixing HTML and GWT's Widgets has never been so easy and fun ;)
• working with CSS - GWT has always, of course, embraced CSS, but with the introduction of GWT 2.0 (and UiBinder) they took it to another level. Let's look at a CSS file from a "normal" web application - hundreds, if not thousands of lines, hard to navigate, some styles are redundant but it's hard to notice that, some aren't used at all, add to this mix the need to please IE6/7 and you get yourself a nightmare. With GWT, you can instruct it to perform the similar tasks it did for the JS code for CSS - so it will prune all the unused CSS styles, merge where appropriate, minimize and obfuscate the class names, and many more (including conditionals, constants, etc in your CSS files). You are encouraged to keep your styles in their respective UiBinder's XML files - makes organizing and finding them so much easier. Last but not least, you get an error when you misspell a CSS style name - less hassle then trying to do the same via Firebug or a similar tool
• OOPHM - Out of Process Hosted Mode, with this, they fixed one of the biggest disadvantages of GWT - now, you get to use Hosted Mode in the browser of your choice (if that choice is Firefox, Safari, IE or Chrome, but at least you can use any version you want). The design of OOPHM also allows you to do cool stuff like run Windows in a VM, and connect from the IE there to the Hosted Mode running on the host OS (Linux/MacOS) - no need for hacks, copying files after every compile, etc
• you get to say /ˈɡwɪt/ a lot ;) (this is a quote from one of the presentations on Google IO 2009, IIRC)
• many more.. Take a look at the videos from Google IO 2009 and browse through the GWT wiki to see more stuff that makes creating RIA easier and less error-prone with GWT :)

In between

Depending on your experience and/or preferences, the following might be an advantage (it is to me, but at times it's a PITA ;)) or not:

• the out-of-box collection of Widgets is kept small and simple. Now, if you're coming from some full-blown GUI framework (be it web or desktop), you might be surprised at how relatively small the number of Widgets GWT has. But according to the GWT's devs, it's kept like this on purpose - the basic Widgets are all the tools/"blocks" you need to build your own, customized to your needs Widgets. The alternative is to provide a variety of all-purpose Widgets that have to support many use-cases... The result is a kinda sluggish UI (at least IMHO - check out for yourself projects like SmartGWT or Ext GWT). That is to say, the GWT Widgets are quite nicely written - for example the SuggestBox has a lot places where you can override the default behavior with your own - you can specify a different way to display the suggestions (SuggestBox.SuggestionDisplay), fire a custom action when the user selects a suggestion (SuggestBox.SuggestionCallback) or just provide a custom SuggestOracle for feeding the SuggestBox with Suggestions...

---

Bottom line is - try GWT, chances are you'll love it and will never want to write in pure JavaScript ever again ;)