Smart GWT 2.4 has been released and, as expected, they are jumping on the HTML5 and iOS/Touch bandwagon. The fact that the touch support doesn’t require code changes for existing apps is most welcome. Also, the mention of the upcoming Smart GWT Mobile with “pixel perfect iOS look and feel” sounds intriguing. Many have tried, few have succeeded.

From the release announcement:

• GWT 2.1.1 Compatible
• Smart GWT QuickStart Guide
• Touch & Mobile support : Support for iPhone, iPad and iPod touch devices with no code changes required.
• Offline support : The Offline subsystem provides features for storing and retrieving values in persistent browser storage. It is also seamlessly integrated into the normal DataSource request/response cycle. With a single property DataSource.useOfflineStorage you can enable automatic offline caching of recently fetched data so that if a user goes offline they still have access to last data they viewed.
• User Defined data highlighting allows users to highlight important or unusual data values in a ListGrid or TreeGrid based on dynamic user defined rules instead of hard coding such logic for background and foreground cell colors within code. A Highlight Editor allows end users to fully configure such highlight rules to customize their view of the data.
• Advanced Hover components allows any UI component to be added as a hover, such as a grid, chart or even a layout combining several components when hovering over a ListGrid or TreeGrid row.
• Simplicity theme : A new ultralight skin that is easily customizable and virtually image free. This can be viewed by selecting the “Simplicity” theme from the dropdown in the Showcase explorer.
• IE Performance improvements : Performance improvements have been made across the board but some IE specific performance enhancements have been made and users can expect a significant improvement in responsiveness in IE.
• 24 hour Calendar support : The Calendar component now supports 24 hour time formatting.

The GWT team has developed something that truly shows off this engine in their port of Quake2 to GWT. Seeing the game run with amazing fps in a browser, with online multiplayer network support via WebSockets, is something to truly behold.

Give it a watch:

And build it and run it yourself!

How did the team create the port?

Stefan Haustein, Ray Cromwell and Joel Webber were at a GWT summit and happened upon Jake2 the Java port of Quake2 that runs on top of JOGL for OpenGL. Ray could see that Joel had a glint in his eye, and the porting began!

To get the rich 3D graphics they went for WebGL using a GWT wrapper library that Stefan had built. Jake2′s heavy use of java.nio.Buffers were handled by implementing JRE classes that mapped those to WebGL typed arrays. File system code that used RandomAccessFile was emulated by using HTML5 LocalStorage. The OpenAL audio system was implemented using HTML5 audio.

The various team members got varying fps depending on their machines. A Linux notebook managed 60fps, a Mac Pro got 45fps, and a Macbook Pro got 25fps. WebKit was able to perform the best of the browsers right now because it doesn’t have the multi-process per tab tax that means a lot of OpenGL buffer copying.

I think this is a big deal in a couple of ways:

• You can build fantastic games that use rich 3D engines and fast network access right on the Web. How do you “join a game”? You just share a URL! Tweet away! Now you can have these rich games just a URL a way. No install required.
• Game engines push a platform. Although we are talking about building an older game engine (doubt that the latest and greatest engines would run like this!) this is PLENTY for building rich effects and applications. Take some of this richness and look at something like Google Docs. How much smoother and nicer can it be? We can create beautiful applications with effects like butter right now.

Credit

Ray Cromwell (who posted on this here) contributed audio/mouse/keyboard and localstorage for prefs, plus some minor GL shader debugging. Joel Webber and Stefan Haustein did the other 80% (Joel did the majority of the original code surgery to get the multiplayer game running under GWT minus graphics, Stefan did the heavy lifting on WebGL and singlehandedly ported the single-player game logic)

People still claim that “the browser is slow” and “JavaScript is slow”. Not in 2010 my friends!

Who needs Native Client now when you can build apps and games like this! Well, to be fair, there is a niche of folks who want to use C libraries and frankly prefer that world… so NaCl is for them.

For the rest of us though? Our world keeps getting better, almost daily!

Sanjiv Jivan has released Smart GWT 2.0, a big release for the project.

The core updates are:

GWT 2.0 support

Smart GWT supports GWT 2.0 and continues to remain compatible with GWT 1.5, 1.6 and 1.7. This release is a drop-in upgrade for users of earlier versions of Smart GWT. The API’s of Smart GWT have been very stable and as a result there will be no upgrade cost or migration effort for users upgrading to Smart GWT 2.0

New Enterprise Blue theme and significantly improved Enterprise Gray theme

These themes now closely follow the Vista UI specification and guidelines. Incorporating the new theme is as simple as inheriting the new EnterpriseBlue theme module and does not require any other changes.

And other features include:

• Drop-in upgrade with no upgrade or migration effort
• Multi-Column sort support
• Grid Row Expansion support for
  • memo rows
  • detail views
  • nested editable form
  • nested editable grid (useful for representing 1-many relationships)
  • any custom embedded component
• Collection of standard Window icons, picker icons and transfer buttons as part of every theme
• Improved Showcase demo with ability to search for samples by keyword. Added several new samples
• Various other enhancements like Date field masks, improved IE 8 and Safari strict mode support.

To see the breadth of the project, make sure to check out the showcase which is very deep indeed. Nice work guys!

Ben and I are at Google Campfire One with a Who's Who from the Web developer space. When I first met the GWT team they were talking about revolutionary new Web tools that they wanted to create, and I have a feeling that they will be talking about what they have come up with.

David Glazer (Engineering Director) and Andrew Bowers (GWT PM) are kicking off the build up with the obligatory ra-ra for HTML5 and the great new browsers we have to build "modern Web applications".

Next, Andrew gets into the world of development and deployment of Web apps and the productivity and performance improvements.

First up, productivity. Andrew is discussing AdWords which uses GWT in places. AdWords uses a UiBinder a declarative approach to building GUIs:

AboutDialog.java:

After the demo he talks about the Developer Plugin and support for multiple browsers.

Matt Mastracci, founder of Dotspots, is now "by the fire" ready to talk to us about how they use GWT. First up he shows a GWT application that compiles down and uses it as a Firefox add-on. They have also used the same code that they incorporate in a Chrome Extension and other areas. GWT 2.0 contains a new "developer mode" and Matt shows it in action as he hits Eclipse from the browser to quickly iterate. No need to recompile.... (since GWT is a compiler). Of course, using JS itself allows you to make a change and reload :)

Bruce Johnson, co-creator of GWT, is now "fired up" to talk about the deployment stage. How does the GWT compiler do its job? It can Prune dead code, Devirtualize, Inline, Eval, and Obfuscate.

Developer guided code splitting is next up which cuts down the initial download and only grabs what it needs.

Someone from MediaBeacon shows a rich app (which looks exactly like how I envision a GWT app ;) as a demo of code splitting.... going from 1.5MB to 100k in 16 lines of code.

Now Kelly Norton (awesome guy) is up on stage with a "Web Workers" ice hockey jersey. He has the new tool, Speed Tracer! It monitors apps in real time, shows hidden browser events, and gives advice through hints.

Kelly has fired up Google Calendar to show a demo. I love the "Sluggishness" activity bar showing work in real time. The graph view is nice, and seeing the events is fantastic. E.g. script eval, script parse, paints, parse HTML, DOM layout, CSS style calculation. You can see it!

Speed Tracer itself is a Web application deployed as a Chrome Extension. One nice feature is that you can export a trace and send it over to someone via email and they can manipulate and play with the view on that data. It is a GWT app itself, and it looks not-like you think of a GWT app. Very nice indeed.

That's a wrap, thanks for the new tool Kelly, Bruce, Andrew and team!

Chris takes these ideas and applies them to the starter project created by the Google plugin for Eclipse. To get this done, he uses a slew of libraries:

NOTE: currently GIN needs to be built from source using SVN/Ant.

You'll also need the following libraries at the server:

Then, the tutorial walks you through setting up your views, presenters, and events. It is Java, so you will notice a fair amount of source code (but at least the GuiceServlet gets rid of most of the XML). Just joshing with ya!

It was cool to see my buddy Rob's Customware being the place that created some of the key libraries. Good on ya mate!

John told us:

Canvas-rendering corrects GChart's most serious visual quality limitations (including the most often mentioned problem by its users: the banded-filled pie slice).

Coupled with its existing feature set and ease of GWT integration, the canvas-rendering option makes GChart an excellent choice for those who want to add basic charts to a GWT application without a lot of fuss.

To access these features, you'll need to plug an external canvas library into GChart (GWTCanvas in the gwt-incubator is reccommended) as described in detail in the setCanvasFactory method.

With the external canvas in place, the next step is to tell GChart you want a curve to be "continuously filled" by invoking setFillSpacing(0).

With each such continuously filled curve, GChart automatically exploits your external canvas library to improved the quality and speed of that curve's rendering. Specifically, banded-filled pie slices become solid filled, dotted connecting lines become continuously connected, and (the biggest stretch) bar charts become area charts. See the setFillSpacing method's javadocs for a detailed description of how each existing symbol type implements this new "continuously-filled", canvas-powered, rendering option.

Note that GChart's previous HTML-only rendering is still available, and is the default rendering mode if you don't bother to plug in an external canvas.

Check out the demo

His project lets users create and share their own versions of short piano pieces (and print them out as musical scores for use in live concert performances). It was built using GWT and, among other things, it shows that it's relatively easy to put together a simple GarageBand-style music editing interface using Ajax.

For those who know of Chronoscope, this is the commercial version, big changes include more accurate multiresolution filtering algorithm, Android native version, Chart Server, iPhone integration, synthetic datasets, a number of other things. We eventually hope to include a subset of complete implementation of R in GWT, to allow statistical work to be done totally in browser.

At the 7:20 mark, you can see GSS, which is an implementation of a CSS parsing and cascade engine in GWT, to support our totally custom set of properties, elements, and pseudo-classes.

Very cool indeed Ray.

SendMeHome lets you to assign a unique code, called a SendMeHome ID, to any physical item. We are launching our newest feature, Stories, which connects a group of people through an item as it travels the globe. Social networks such as Facebook mainly involve users communicating with their ‘friends’, SendMeHome is unique because it uses a real-world object to tell a story that enables interaction between new and like-minded people who may otherwise have never known of each other’s existence.

Our beta users have already created stories to write a collaborative novel, share cooking tips, discuss political events, and even transport a statue to Easter Island.

The site uses GWT components and integrates with services such as good ole Google Maps. You can check out a story. Having a code associated to items is a lot of fun (read: Webkinz) and seems to be something that can be useful.

It is a tour de force of not only a huge widget library, but he explains how it is much more:

So what's so smart about SmartGWT? Let me try to explain. SmartGWT is not just another Widget library. While most Ajax frameworks focus primarily on presentation and displaying mostly read-only data, either local or via XML / JSON, SmartClient was built with server side integration in mind. Most enterprise applications are not just about about data presentation, but about being able to propagate data changes made by the user to the backend. So while its tempting to use library X that has a cool tree widget, it's not until you actually try to use it your application that you encounter the real world hard problems. For example, how do you take data from your business objects on the server to not only display in a tree widget, but also be able to update your data model when, say, the user reorders the tree nodes or make edits / deletes in the UI. How do you display hierarchical data where nodes may have hundreds of children? And so on..

Most Ajax frameworks stop short and leave it up to the user to manage state on the client side and propagating the changes to the server. This is not a trivial problem! Over the past few years UI widget libraries have improved significantly and there are now various options available to users. Simply put, having good looking widgets is not the hard problem today. In addition to having good looking widgets, having end-to-end integration of the UI components with the backend is the hard problem. It's this 20% of the functionality that takes 80% of the time in building most enterprise applications.

The showcase will give you a good feel for what is out there, and it contains some interesting items including:

• Miller Columns: The ColumnTree provides an alternate navigation paradigm for Tree data, sometimes called "Miller Columns" and seen in iTunes
• Nested Grid: A convenient way to display 1-n relationships
• Printable Views: SmartGWT supports printable views of its components.
• Advanced Filter Builder: a databound filter builder.
• Tile View: Representation of data as "tiles". Again, TileGrid supports data binding so sort / filter and edits can be easily performed.
• Calendars : A Google Calendar like widget that supports databinding so edits and drag drop changes can easily be propgated to the server for persisting.
• TreeGrid : Supports multiple columns, editing, column locking, lazy loading and more.
• Live Grid / Tree: Grid / Tree virtual scrolling or live grid

Really amazing work. Sanjiv recently had a Q&A session with InfoQ where he talks about the approach taken in developing SmartGWT and the his thoughts on the differences between SmartClient and Ext.

Rodrigo Reyes has announced a new project called AbstractCanvas, a GWT project that sits on top of HTML Canvas and Java2D.

The same code can thus run in the browser, or on the server.

You can then write code such as:

The first, is a fun chess diagram builder that lets you build out a chess diagram and export it out:

Also, he has created Sasha Maps, an API that abstracts mapping implementations allowing you to plugin your own system (but Google Maps and WMS are implemented).

The appropriate Hello World could look something like this:

The API gives you interfaces to setup custom maps, actions, overlays, map widgets, and more.

The SourceForge project page has a brief overview and pointers to a tutorial, a widget showcase, and more.

The UI combines a Vista-like "Start" menu along with an OS X-like dock (using everyone's favorite fish-eye widget). It also has a built-in widget system that leverages Google Widgets. Overall, it's a pretty nice implementation of a desktop and windowing in Ajax.

The framework itself is "GwtPHP" which attempts to take all the advantages of GWT and deploy them to PHP backends in an attempt to solve the problem of limited Java-friendly hosting services. Unfortunately, the framework isn't available for use until sometime in early November.

Dual-License

The developers intend to use the familiar "free for hobbyists, pay up for commercial use" licensing model (what their licensing page calls a "what for what" model).

Give some feedback

Viktor says that they are quite keen to get feedback from folks on the project, so interested folks should get in touch, let them know what you think about the licensing model, and perhaps get early access, etc.

Darrell Meyer has announced the release of Ext GWT 1.1 which is said to "shortens the feature set gap between Ext JS."

New Features

The Grid component wraps the Ext JS grid, and it includes support for grid plugins which fit into component lifecycles. You can also use a subclass, EditableGrid which.... allows you to edit content on the fly.

Auto complete has been added to the combo boxes a la Google Suggest.

Portal is a custom layout container that uses a multi-column layout on contains Portlets. Each Porlet can be drag and dropped to change order or move to another column. Each Portlet can contain any content and supports icons to expand / collapse, close, etc.

The desktop mimics the behavior of the operating system look at feel. It is now possible to create multi-window applications with support for a task bar and start menu. Windows support normal, maximize, and minimize states. The start menu is a custom menu that allows new menu items. In addition, there is support for a “task” area for adding additional items.

Java Bean Support with BeanModel

The Ext GWT Store and Binder API work with ModelData instances. The primary goal of ModelData is to provide a type of “introspection” as GWT does not allow runtime inspection of Java objects. You can query ModelData for a list of properties it contains, and these properties can be retrieved and set using the parameter name with the get and set methods.

Although this approach works, it forces you to either implement the ModelData interface in your Java Beans or extend the Ext GWT base classes that implement the ModelData interface. What is missing is a way to use your Java Beans as is, without having to extend the Ext GWT base classes or implement an “invasive” interface.

There are also new examples:

• Forum search is an example of a combo box, using a custom XTemplate, and remote data. The data can be paged with built-in support for a paging toolbar.
• Image Chooser shows loading a ListView in a Window. Each item has a linked details view, and the ListView supports custom sorting and filtering.
• This example shows a Dialog using an AnchorLayout to “anchor” the form fields to the dialog dimensions. When resized, the fields will adjust their size to match the dimensions of the dialog.

I have seen the GWT team working very hard indeed on GWT 1.5, and they must be very happy to see the final release shipped and complete:

GWT 1.5 delivers what we think are an impressive number of improvements, about four hundred issues if you're counting. We're also happy that one of those is issue 168, our most-requested feature, Support for Java 5.

The high level new feature sets are:

• Java 5 language support and enhanced JRE emulation
• Performance optimizations and easier JavaScript interop
• Prettier widgets, better DOM, accessibility, and bi-di

You can see a lot of this at work in the showcase area. There you will see all of the widgets and examples that come out of the box, and the community has developed even more for you. In particular, Ray Cromwell has some great real world examples that he shares in his book and talk.

Download GWT and take a look.

This project has stepped up to higher gear recently, and we have seen the GALGWT 1.0 release candidate appear.

What is in GALGWT?

The project is a collection of libraries that provide Java language bindings
and API specific 'plumbing' for some Google JavaScript APIs. The goal is to
make it easy for developers to use these JavaScript APIs with GWT. Libraries
available at this time include a new version of Gears, as well as new
libraries for Gadgets and the Google AJAX Search API.

Gears 1.1 Library

A new version of the Gears library is available. In addition to the earlier
version's support for the Gears LocalServer, Database, and WorkerPool, 1.1
adds integrated support for offline applications and updated sample
applications. The bindings have also been refactored to use GWT 1.5
JavaScript overlay types and a new package hierarchy.

Gadgets 1.0 Library

The Gadgets library simplifies gadget development with GWT by automatically
generating a Gadget specification from Java source and inserting a selection
script in the specification much like a regular GWT project. After compiling
your gadget with GWT, all files are in place to publish your gadget. This
version currently supports the legacy Gadgets API based on the _IG_...
namespace.

Google AJAX Search 1.0 Library

The Google AJAX Search API lets you put Google Search in your web pages,
including Web, Local, and Multimedia searches. This library allows you to
access the API from Java code compiled with the GWT compiler without having
to write additional JavaScript code.

Sanjiv Jivan, original creator of GWT-Ext, posted on SmartGWT, a new wrapper on top of SmartClient.

Charles Kendrick of Isomorphic, creator of SmartClient, announced the new project as well as the approach they have taken:

we’ve taken an approach of generating GWT code from SmartClient’s documentation, combined with hand-coding portions that can’t feasibly be generated. By tweaking our documentation set to contain additional metadata (some of it GWT-specific), we’ve been able to generate code you might not otherwise expect, including things like enumerated constants and convenience constructors.

What this means is that the first release of SmartGWT will provide the complete SmartClient API, fully documented.

You can now write code such as:

Sanjiv Jivan joined the project under the terms that Isomorphic sign a document that said:

The founders of Isomorphic Software are committed to keeping a complete, up-to-date version of SmartClient available under an LGPL license.

We continue to invest heavily in building new features, skins, tutorials, and tools for SmartClient LGPL.

We think it's normal and expected that some people receive great benefit from LGPL software and do not pay. The spirit of open source, in a nutshell, is that releasing free software creates so much wealth that the portion that flows back to you is more than enough.

Sincerely,
Charles Kendrick
Alex Shvedoff

The first example that Bruce gives is to mix JSON objects with Java:

Bruce then shows us some performance wins that you get, as GWT gets to do a lot of inlining:

A quick digression for compiler geeks. Another neat thing about overlay types is that you can augment the Java type without disturbing the underlying JavaScript object. In the example above, notice that we added the getFullName() method. It's purely Java code — it doesn't exist on the underlying JavaScript object — and yet the method is written in terms of the underlying JavaScript object. In other words, the Java view of the JavaScript object can be richer in functionality than the JavaScript view of the same object but without having to modify the underlying JS object, neither the instance nor its prototype.

(This is still part of the digression.) This cool wackiness of adding new methods to overlay types is possible because the rules for overlay types by design disallow polymorphic calls; all methods must be final and/or private. Consequently, every method on an overlay type is statically resolvable by the compiler, so there is never a need for dynamic dispatch at runtime. That's why we don't have to muck about with an object's function pointers; the compiler can generate a direct call to the method as if it were a global function, external to the object itself. It's easy to see that a direct function call is faster than an indirect one. Better still, since calls to methods on overlay types can be statically resolved, they are all candidates for automatic inlining, which is a Very Good Thing when you're fighting for performance in a scripting language.

From this Java code:

The compiler inlines away to get to the followinig (not obfuscated to see):