The new crop of HTML5 web browsers are capable of some pretty amazing things, and several of our engineers decided to take some 20% time to see how far we could push them. The result? An HTML5 port of Id's Quake II game engine!
We started with the existing Jake2 Java port of the Quake II engine, then used the Google Web Toolkit (along with WebGL, WebSockets, and a lot of refactoring) to cross-compile it into Javascript. You can see the results in the video above -- we were honestly a bit surprised when we saw it pushing over 30 frames per second on our laptops (your mileage may vary)!
It's still early days for WebGL, so you won't be able to run it without a bleeding edge browser, but if you'd like to check out the code and give it a whirl yourself, you can find it here. Enjoy!
It's been a while since we've put together what's been going on in the GWT community, and there's no time like the present to do so. Below are a handful of updates and new releases that have taken place over the past few months.
Smart GWT 2.1: Smart GWT, a framework that provides enhanced widgets that can coexist on both your client and server, has released a 2.1 version. Below are some of the key features of this release:
RaphaelGWT: The Hydro4GE team has open sourced their RaphaelGWT project. RaphaelGWT allows you to integrate GWT with Raphael, a lightweight JavaScript library for cross-platform vector graphics.
Gilead Update: Gilead, an Open-Source framework for seamless integration of Hibernate and GWT, has released an updated version of its project that contains the following features:
GWT MVC 0.4: The GWT MVC project, aimed at creating a layer on top Google Web Toolkit's widget library capable of implementing RIAs in easier and more conceptually guided way based on Model-View-Controller design pattern, has released version 0.4.
GWT Service Resolver: The gwtserviceresolver project has been added to Google code. Similar to gwt-dispatch, gwtserviceresolver allows you to minimize the code changes that are necessary as you add new RPC services.
GWT Mosaic: The GWT Mosaic project has added some tutorials to help developers wire up UiBinder-based elements with GWT Mosaic Actions.
GWT 2.0.3 has been released and is available for download here:
This was a minor release that includes the following fixes:
GWT 2.0.2 has been released and is available for download here:
Inevitably, as your app grows, you will find areas that involve consuming large amounts of textual data and performing some action as a result. You may be handling a JSON response, a serialized GWT RPC payload, or HTML that has been rendered on the server. In any case, you're a test-driven developer and you know that you have a handful of automated tests just wanting to be applied. The example below is one way of constructing such tests. And while it's not rocket science per say, it's so simple and useful that we felt compelled to tell others about it.
So let's say you're doing some server-side rendering, and somewhere in your code you most likely have a permutation of the following:
DOM.createDiv().setInnerHTML(foo);
Once inserted, you might apply some style, inject some values into the resulting HTML, etc.. Basically with the DOM structure in place, the rest of your app can move and do its thing. And "its thing" is often the more complex part, which begs for a test case. You want to make sure the "thing" it's doing is the right thing.
So at this point you happily code up a few GwtTestCase(s) and suddenly realize two things. One, "foo" can be really long, is a pain to maintain in code, and is ultimately polluting your test cases. Two, "foo" is most likely to change as your app grows, whereas your test cases shouldn't. Wouldn't it be nice if you could abstract "foo" away into a file that you load into your test cases, just as you do with other non-GWT test cases? Well, the good news is that you can. Much like other resources (e.g. ImageResource, CssResource, etc...), GWT has a mechanism for embedding text files into your app by specifying an associated TextResource within a ClientBundle. For example:
public interface TestResources extends ClientBundle { @Source("com/google/gwt/example/test/ExampleTest.dat") TextResource foo(); }
Here Example.dat would contain the HTML that I want load into my test case, and given that it's strictly for testing purposes you'll notice that I've added it under the "example/test" folder. At this point we have a ClientBundle from which we can grab the contents of our Example.dat file. In order to do something meaningful with this, we'll use it in a newly constructed GwtTestCase:
public class ExampleTest extends GWTTestCase { TestResources resources; public String getModuleName() { return "com.google.gwt.example.Example"; } public void gwtSetUp() { resources = GWT.create(TestResources.class); } public void testFoo() { DOM.createDiv().setInnerHTML(resources.foo().getText()); /* * insert complex code to be tested * */ } } }
Using this technique we've managed to keep our test cases clean, and centralized any test data changes within ExampleTest.dat rather than the ExampleTest source code. So clean, so simple, and hey, it even works when you want to load up some JSON data to test with.
We already have quite a few Google Web Toolkit I/O sessions and Developer Sandbox demos lined up, and we expect this number to grow over the coming months. Here's a partial list of the GWT sessions that are already listed on the I/O website:
Over the next couple of months, we'll be adding new GWT sessions and more GWT Developer Sandbox participants to the I/O website. For updates on when new content is added, follow @googleio on Twitter.
Registration for Google I/O (at the early bird rate of $400) is open as of today. We hope you'll be as excited about this year's I/O as we are, and we look forward to seeing everyone in May.
Google I/O May 19-20, 2010 Moscone West, San Francisco http://code.google.com/io
Earlier tonight, we wrapped up a very exciting Campfire One at which we announced that GWT 2.0 is now officially available. In addition to major improvements in the GWT SDK and the Google Plugin for Eclipse, GWT 2.0 includes a brand new performance analysis tool for Chrome called Speed Tracer.
We hinted at it a few weeks ago, and now it's available: Speed Tracer is a powerful new performance analysis tool for Chrome that gives you unprecedented insight into the inner workings of any web application — not just those created with GWT. Want to know why your web app feels sluggish? Speed Tracer can help you find the answer.
It's fun to see Speed Tracer in action, so here's a quick introductory video...
As an aside, Speed Tracer has a pretty snazzy user interface, eh? It was built with GWT.
Here's another quick overview video that highlights some of the cool new features in GWT 2.0...
Now let's talk in more detail about what's new in the GWT SDK and the Google Plugin for Eclipse...
-draftCompile
.ui.xml
.java
GWT.runAsync()
<script>
GWT 2.0 is the culmination of many months of collaborative development, and on behalf of the the entire GWT team, we'd like to thank the WebKit team, with whom we've worked closely to add the low-level instrumentation necessary to make Speed Tracer possible.
And, as always, a huge thanks goes out to the GWT developer community, many of whom have bravely followed the tip of the GWT trunk in svn, trying out new in-progress features and helping find bugs — and even submitting patches to fix them.
Believe it or not, we've still only scratched the surface of what's new. As always, GWT is open source and free to use. We hope you'll give GWT 2.0 a spin.
Download Google Web Toolkit 2.0
Happy coding! See you online.