Ajax for the Real World

The first release of SmartGWT Enterprise Edition is now available.

Download it here.  Check out the Showcase here.

What is it?

SmartGWT Enterprise Edition (SmartGWT EE for short) is to SmartGWT what SmartClient Enterprise Edition is to SmartClient - an enterprise version of the product that includes Java Server side functionality, additional tools, and a classic commercial license in lieu of the LGPL.

For teams with existing Java functionality, SmartGWT EE provides greatly accelerated integration with SmartGWT’s visual components.  In many cases it is possible to take existing Java methods in an application and bind a SmartGWT grid or form to those methods without writing any new code, simply by specifying what method to call in a DataSource XML file.

For those using Hibernate, it’s even simpler.  A Wizard within Visual Builder allows you to simply pick any registered Hibernate entity from a list, and SmartGWT EE will create a SmartGWT DataSource that provides full read-write binding to that Hibernate entity.  Just provide the generated DataSource to a SmartGWT grid or form with no other configuration, and you have a full CRUD UI: create, retrieve, update, and delete Hibernate-managed entities.  It can even execute the complex search criteria that the FilterBuilder allows a user to specify.  There’s no need to create redundant Data Transfer Objects (DTO’s), or worry about Hibernate-managed lazy associations between entities in your domain model. Only those properties mapped in the data source are passed to the client, and during updates only those properties that have been modified (and not the entire bean data) are sent from the client to the server with the changes transparently reflected in your server.

A corresponding Wizard exists for binding to database tables stored in any popular database, again with full read-write binding.  And in both cases, you can easily add business logic that runs before or after the Hibernate or SQL binding, which can modify the request before it executes, modify the output, or take any other action.

There’s even a “batch” version of the binding tool.  Do you have a large application with 1000+ Java Beans, or 1000+ SQL tables?  Make them all accessible to SmartGWT UI widgets in one step.  The batch version of the tool includes source code, so you can customize how generation is done.  Do you have Java annotations that could be used to drive UI behaviors like required:true or canEdit:false?  There’s sample code for that.  Do you need to show a special input control or add special validators wherever a field with a certain Java type is used?  Easy change.

This is ideal for large scale enterprise development:

1. you get all the benefits of model-driven development, including rapid prototyping and the ability to make pervasive changes driven by changes in the model
2. you retain full extensibility: you’re working with a UI platform that allows you to build completely customized interfaces where necessary
3. your customizations are minimal and easy to maintain; you don’t have to maintain the “code soup” typically output by code generator tools

SmartGWT EE future features

This first release of SmartGWT EE omits certain advanced components and services, including the CubeGrid and the Messaging module.  These are coming soon; we’ll be rolling out enhancements to SmartGWT EE at a rapid clip similar to what we’ve been doing with SmartGWT.

Also in this release, while Visual Builder is fully functional, it currently saves screens as XML files which cannot (yet) be readily converted into Java code for use outside of the tool.  These XML files are in SmartClient’s Component XML format and can be edited and re-loaded by Visual Builder (as with SmartClient).  Future versions of Visual Builder for SmartGWT EE will include tools to generate Java from this format, so any screens you build now are forward compatible.

Pricing

As part of the final release of SmartGWT Enterprise Edition, we’re introducing a new pricing level that works better for small teams, called SmartGWT / SmartClient Pro.  This product will have all of the client-side functionality of SmartGWT / SmartClient LGPL as well as server-side functionality similar to the 6.5.1 release of SmartClient Enterprise - server connectors, validation, basic Hibernate and SQL connectors, as well as Visual Builder - and will be offered at a price that approaches $600-800 per developer for a team license.  There will no longer be a distinction between an Intranet vs a Small Vendor Edition license.   In a nutshell this very closely matches the existing Enterprise offering, but is now less expensive.

SmartClient and SmartGWT Enterprise Edition will now come with a different license suited to larger deployments which will carry stronger legal guarantees (eg indemnity), and for that reason will also be a “Contact us” licensing level.  A handful of new features in 7.0 will be held back to the Enterprise level license, including two shown in the new SmartGWT EE showcase: a feature we call Transaction Chaining which is demonstrated in the Queued Master/Detail Add example, and the batch mode of the DataSource generator mentioned above.  Hence the need to announce the upcoming pricing changes today - further details on the feature breakdown will be posted soon.

Anyone who has already bought licenses to SmartClient Enterprise will be able to continue to renew at the currently posted pricing, which we will also continue to honor for the next 45 days (including any quotations).  So, now is a great time to purchase Enterprise Edition, as you have an opportunity to purchase the Enterprise feature set at slightly above the price of Pro, if one of our website licenses works for you.

About SmartClient 7.0

Everything discussed for SmartGWT EE above is also included in SmartClient 7.0.  Our apologies to users of the free version for the delay in getting a final release out (most enterprise customers opted to get certified on an interim build).  However, it’s worth the wait.  If we were to take a cue from the Mozilla foundation, who recently renamed Firefox 3.1 to 3.5 to reflect how much is new, we might have to skip a few numbers (kidding - we’ll stick with 7).  Stay tuned.

Aptana can be configured to catch one of the most common Javascript programming errors: the dreaded “dangling comma”, an extra comma left trailing after the last property in an object literal. This problem can be fiendishly difficult to spot, particularly if you have a complex, nested arrangement of object literals.

Aptana can point you at these bugs right there in your source editor. To set this up, go to the Window menu and select Preferences, then navigate to Aptana -> Editors -> Javascript -> Validation. Your screen now looks like this:

Ensure that the “JSLint Javascript Validator” box is checked. And that’s it - dangling commas will now be reported as you type, like this:

Yes, it’s true! A project has been underway for some time to create a GWT (Google Web Toolkit) wrapper for SmartClient.

The project, dubbed SmartGWT, will be made available under the same LPGLv3 license as SmartClient LGPL, with commercial licensing available as well. It will be hosted on Google Code with public SVN access, and external committers will be welcome to participate as with SmartClient LGPL.

We are happy to say that Sanjiv Jivan, the creator of another popular GWT wrapper, is involved in the development of SmartGWT. Sanjiv brings expertise in precisely the right areas, and with his help we’ve been able to make much more rapid progress with SmartGWT than would otherwise be possible. We expect a preview release sometime in late October to early November.

Our Approach

(if you’re asking ‘what is GWT?’ read “Why GWT?” below)

Anyone who has looked deeply knows that SmartClient is a vast, very complete system - a recent count is that SmartClient supports more than 4000 documented, supported APIs. Translated to Java, this number will be far larger.

For this reason, 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. Out of the gate, SmartGWT will be the most complete GWT platform in existence. And of course, all future versions of SmartGWT will match the API set of the latest SmartClient release.

Why GWT?

GWT allows you to write Java code which is translated to JavaScript by a special compiler, so that it can be run in the browser. This is best explained by example:

You write Java like:

import org.smartgwt.client.*;
import org.smartgwt.client.widgets.Button;

...

Button button = new Button("myButton", "Click me");
button.addClickListener(new ClickListener() {
    public void onClick(ClickEvent event) {
        ISC.say("Hello World!");
    }
});

This means the same thing as:

isc.Button.create({
    ID:"myButton",
    title:"Click me",
    click:"isc.say('hello world!')"
})

There are many approaches for “hiding” JavaScript behind a server-side Java abstraction (such as JSF, JMaki, etc). All these approaches have a common flaw that any code you write in Java requires a trip to the server to execute. The more customization, the more trips to the server, throwing away the primary benefits of Ajax (scalability and responsiveness). In these frameworks, something like a custom drag and drop interaction is essentially impossible - it’s not realistic to contact the server every onmousemove().

GWT differs fundamentally from these server-oriented Ajax approaches. In GWT, the Java code you write actually executes as JavaScript in the browser. So you can write event handlers, drag and drop logic, even custom subclasses of SmartClient widgets, and all of this code executes in-browser, exactly as though you were using SmartClient directly via JavaScript.

In a nutshell, with GWT you get the robust toolset of Java and the performance and scalability of a true “smart client” architecture.

It’s also important to understand that, although you are using Java instead of JavaScript to build your UI, you aren’t tied to a Java server. You can use SmartGWT with any server technology supported by SmartClient itself, including XML or JSON services built in PHP, or WSDL web services. And that combination is still an entirely free, open source offering.

Get Involved

If you are interested in getting the absolute first available sneak peak of SmartGWT, or if you are interested in getting involved in the project, send email to smartgwt at isomorphic.com.

In the meantime, it’s important that anyone choosing platforms right now knows about this very compelling option.  Please help us spread the word - to your colleagues, and to the Ajax blogs and sites you read most!

Thanks,

              Charles

We’re pleased to announce a beta release of the SmartClient plugin for Aptana Studio. Among other features, this plugin provides code auto-completion for SmartClient APIs, boosting your efficiency and making it easier to learn and discover SmartClient’s rather vast functionality.

Eclipse fans, take note: Aptana can be installed as an Eclipse plugin, so this will slot right into your existing environment.

Update

If you’re having any trouble getting this working, a couple of tips:

• If you’re not seeing the “SmartClient 6.5.1″ entries in either Global References or in the New Project wizard, try running “Clean Configuration” on the Help | Aptana Troubleshooting menu
• If you’re trying to make it work with Eclipse 3.4, you must use the 1.1.7 beta version of Aptana - instructions here

The Aptana IDE is already a pretty good place to do Javascript development, with syntax coloring, error checking and code assist for core Javascript functionality. The SmartClient plugin provides these extra features specifically for SmartClient developers:

• The option to create a SmartClient project in the Aptana New Project wizard

• The ability to load the SmartClient documentation browser and Feature Explorer inside Aptana, alongside your code (though you’ll need a tall screen if you want to arrange things like I have here!). The SmartClient docs also appear inside Aptana’s help system.

• Code Assist on the complete SmartClient API. This feature is similar to the Code Assist / Code Completion / Intellisense features found in most modern IDEs for static languages.

The Code Assist support for SmartClient isn’t yet everything we’d like it to be. For example, there is no code assist for the object literal we commonly pass to the create() function. Passing an object literal with properties is a common pattern in a number of frameworks, however, supporting Code Assist for this will require some Aptana enhancements.  We’re reaching out to the Aptana team to see if we can get this working - stay tuned.

The beta version of the plugin is available right now, for those who can’t wait for shiny new tools.  Follow these steps:

1. Grab the Community Edition of Aptana Studio here
2. Download the SmartClient plugin beta here
3. Unzip the plugin file into your Aptana “plugins” folder.  The “plugins” folder should now contain a subfolder called “com.smartclient.6.5.1″
4. Start up Aptana and in the “References” view open up “Global References”.  Check the entry for SmartClient 6.5.1
5. Enjoy…

Finally, just a couple of screenshots showing the Code Assist in action

Showing the list of available classes in the isc namespace:

Showing the class-level methods and attributes of a SmartClient class:

Showing Aptana recognizing “myVar” as a ListGrid instance, and offering code assist accordingly. Note that we are able to do this, even though we created the reference in the standard SmartClient way (using the create() method), rather than using “new”:

Showing Aptana’s code assist support for name, type and descriptions of function parameters:

Showing code assist for known return types. Here, listGrid.getCellRecord() returns an isc.ListGridRecord (as indeed, the last screenshot shows), so Aptana provides code assist for that class appropriately (you can see the full ListGridRecord API in the SmartClient doc window underneath the code window):