Thursday, October 05, 2006

Introduction to the Google Web Toolkit

Learn how to use the Google Web Toolkit to do everything from basic tasks to advanced ones such as RPC communication, history management, and packaging a production-ready application.

Web 2.0 and its technical counterpart, Asynchronous JavaScript and XML (Ajax), are gaining momentum thanks to applications such as Gmail and Google Maps. For Web applications, the main benefit of Ajax is a greatly improved user experience. Although JavaScript and DHTML—the technical foundations of Ajax—have been available for years, most programmers ignored them because they were difficult to master. Today, frameworks written in JavaScript, such as Dojo, can help you build Ajax applications, but you still need a good understanding of JavaScript in order to use them. Google offers another way to help Java developers create Ajax applications more productively. This new framework, called Google Web Toolkit (GWT), can be used efficiently with Oracle JDeveloper. GWT is freely available under the Apache License v. 2.0 at http://code.google.com/webtoolkit.

Main Features and Restrictions

One of the main problems with Ajax development is that you need to master a large stack of heterogeneous technologies. Depending on the nature of your project (for example, business applications), this can be a great drawback.

In addition, different Web browsers don’t support JavaScript and DHTML in the same way. For example, Microsoft Internet Explorer and Mozilla Firefox handle these technologies slightly differently; you’ll need to deal with this if you want your application to run seamlessly on your users’ PCs.

Although most of the Ajax frameworks available today simplify development work, you still need a good grasp of the technology stack. So, if you’re planning to use Ajax to improve only your application’s user experience—if you’re not also using it as a strategic advantage for your business—it may be unwise to spend a lot of money and time on the technology.

GWT proposes a different way to create Ajax applications. It uses Java as a single programming language for both the client and server sides. Is it the return of Java applets? Not at all: GWT provides a compiler that translates the Java code on the client side into JavaScript and DTHML. This solution greatly simplifies the technology stack from the programmer’s point of view: You have to master only Java. The downside is that you have less control over the client-side code of your application because it’s eventually generated by the GWT compiler.

The Java code for the client side of your application is subject to restrictions because JavaScript doesn’t implement the entire object-oriented concepts and APIs available in Java. You can use only a subset of Java keywords and APIs (java.lang and java.util):
  • All the primitive types (such as byte, char, short, and int) as well as their corresponding classes (such as Byte and Char) are directly supported—except for long, which is translated into the JavaScript equivalent of double. It is recommended that you use int instead of long.
  • User-defined exceptions (checked or not) are possible but the method Throwable.getStackTrace() is not available. Some JVM exceptions are also available (such as IndexOutOfBoundException).
  • The keyword synchronized has no effect because JavaScript is mono-thread. The multithread API is not available.
  • Reflection is not supported. However, you can get the class name of an object by using the method GWT.getTypeName(Object).
  • Finalization is not supported.
  • Several objects containers from java.util can be used, such as Stack, Vector, and HashMap. The Date class is also available.
In addition, GWT provides specific APIs to manage the GUI, internationalization, and XML parsing. It also provides a comprehensive library to manage communication between the client and the server. It uses well-known Remote Procedure Call (RPC) principles implemented by a generic servlet (RemoteServiceServlet), which you can specialize for your own needs. You also can use JavaScript Object Notation (JSON) as the data interchange format for your HTTP messages sent with the GWT HTTPRequest class.

GWT also offers an interface, called JavaScript Native Interface (JSNI), which lets you mix your own hand-made JavaScript code with the code generated by the GWT compiler. JSNI uses the keyword native used by Java Native Interface (JNI) to define your own JavaScript functions. The body of these functions is defined inside specifically formatted comments.

Finally, you can unit-test your code inside JDeveloper with GWTTestCase, a specialization of the class TestCase provided by JUnit.

Focus on GUI Programming with GWT

Ajax dramatically changes the way you develop Web applications. Most of the time, an Ajax application needs only a single Web page. Its content is modified dynamically by JavaScript and DHTML to produce a user experience similar to that provided by native applications.

Therefore, GWT provides a programming model whose principles will sound familiar to Swing or AWT programmers. The GUI is no longer specified by HTML tags as in classic Web applications. It’s programmed directly with Java code in a way similar to AWT or Swing. The well-known concepts of GUI programming are available with GWT:

  • Widgets, including the usual items (such as Button, TextBox, and CheckBox) and more advanced items such as Tree and Menu Bar
  • Panels, which contain widgets, with their own layout (panels and layout aren’t separated as in Swing)
  • Events generated by widgets. The listeners must implement specific interfaces.
Loading the GWT JavaScript library and specifying the entry point of your application is easy: all you have to do is create a simple HTML page.

GWT uses Cascading Style Sheets (CSS). Every widget has its own style, which you can change to meet your needs. You must create your own CSS to overload the defaults defined by GWT.

If the standard widgets don’t suit your needs, you can also define your own. (This topic, however, is beyond the scope of this article.)

No comments: