1. GWT . Create
A Fast and Lightweight Future
Ray Cromwell
https://plus.google.com/+RayCromwell

2. Welcome
State of the Community
State of GWT
GWT 3.0 and Beyond

3. State of the Community
•
700+ attending GWT.create
•
3x increase in external contributions (patches)
•
Thousands of Googlers using it
•
~100k users of SDK

4. Looking for Sexy?
Cool New Products using GWT

5. Google Shopping Express

6. New Google Sheets

7. Google Sheets
•
First in a new generation of hybrid apps
•
Shares logic between Server, Android, Web, and iOS
via Java code.
•
Cross compiled with GWT and j2objc
•
Web UI marries Closure Compiler JS and shared Java
via GWT code.
•
Android and iOS UIs marry Java and Obj-C UI with
shared Java.

8. Google Sheets
•
Much faster than predecessor
•
Larger Sheets
•
Local client formula evaluation
•
Offline
•
Faster, smoother, scrolling
•
Supported on all 3 platforms at once.

9. State of GWT
•
GWT 2.6
•
•
Reduced Code Size
•
•
Java 7
Better CodeSplitter
Ambitious plan for upcoming improvements

10. What’s Happened Since
2006
•
JS a lot faster
•
Browsers much more capable
•
Less incompatibility between latest versions

11. Kraken 2200% Faster

12. Capabilities
•
Multimedia: Video, Audio, Camera, Microphone,
WebRTC, Canvas, SVG, WebGL, …
•
I/O: Sockets, FileSystem, LocalStorage,
IndexDB, TypedArrays, Blobs, Web Workers,
Geolocation, …
•
Layout/Rendering: Flexible Box Model, Web
Animations, Scoped CSS, Shadow DOM, GPU
accelerated drawing and compositing

13. Compatibility

14. Mobile Expectations
•
About 50% of web traffic is now mobile
•
Native apps have influenced consumers to
expect jank-free experience

15. GWT 3.0 And Beyond
Fast and Lightweight

16. Lightweight Syntax
Full Java 8 language support

17. No Lambda
Button b = new Button("Click Me",
new ClickHandler() {
public void onClick(ClickEvent e) {
alert("Hello!");
}
});

18. With Lambda
Button b = new Button("Click Me",
(e) -> alert("Hello"));

19. Vs Javascript
var b = new Button("Click Me",
function(e) { alert("Hello"); });

20. Lightweight Js Interop
•
Call Javascript without JSNI
•
@JsInterface, @JsProperty

21. Js Library Sample
function MyClass() {
this.answer = 42;
}
MyClass.prototype.whatIsTheAnswer = function() {
return "The answer to life, the universe, and
everything is ..." + this.answer;
}

22. Without JsInterface
interface MyClass {
int getAnswer();
String whatIsTheAnswer();
}
final class MyClassImpl extends JavaScriptObject
implements MyClass {
public native int getAnswer() /*-{
return this.answer;
}-*/;
}
public native String whatIsTheAnswer() /*-{
return this.whatIsTheAnswer();
}-*/;

23. With JsInterface
@JsInterface
interface MyClass {
@JsProperty
int getAnswer();
String whatIsTheAnswer();
}

24. Zero Work Interop
Could we make this even easier?

25. Zero Work Interop
•
Closure Compiler annotated Javascript
•
Typescript annotated JavaScript
•
Drop in and go
•
Automatically generate JsInterface
declarations from typed JS

26. Demo

27. Using External JS Libraries
•
Must be un-minified to have predictable symbols
•
Live in separate JS execution context
•
Dead or Unused library code not removable

28. The World Today
Host Html Page
<script src=“angular.js”>
<script src=“angular.js”>
GWT Module IFrame
GWT Source
GWT Source
GWT
GWT
Compiler
Compiler
Compiled JS
Compiled JS

29. Radically Better Interop
•
Combine JS and Java as single source tree
•
Globally Optimize Together
•
Output single, optimized application

30. The World Tomorrow
Host Html Page
<script src=“angular.js”>
<script src=“angular.js”>
GWT Module IFrame
GWT Source
GWT Source
GWT
GWT
Compiler
Compiler
Compiled JS
Compiled JS

31. The World Tomorrow
GWT Module IFrame
<script src=“angular.js”>
<script src=“angular.js”>
GWT Source
GWT Source
GWT
GWT
Compiler
Compiler
Closure
Closure
Compiler
Compiler
Compiled JS
Compiled JS

32. Radically Better Interop
•
Javascript library subject to optimizations
together with Java code
•
Smallest code size possible
•
Type-checking between JS and Java

33. Web Components
•
Web Native Templates
•
Custom HTML Elements
•
Encapsulated DOM and CSS
•
•
(Shadow DOM and Scoped CSS)
Kind of like runtime native version of UiBinder

34. Web Components
•
Ecosystem of reusable widgets/components
•
New Interop will make them easy to consume
•
Future of where Web authoring is headed
•
We want to be ready for it

35. Fire and Forget CodeSpliting
•
CodeSplitter allows code to be not be loaded
until needed
•
Reduces initial download size
•
Shared code “leftovers fragment” inhibits
benefits

36. Current Problem
•
Tedious
•
Brittle
•
Lack of Control

37. Next-Gen CodeSplitter
•
Choose to force a split point manually
•
Automatically merge fragments
•
Multiple leftover fragments

38. Back to Basics

39. Simplicity
•
Radically Simpler Interop with JavaScript
•
Targeting Modern Browser Capabilities
•
Emphasis on Mobile

40. Fast
•
Improvements to Arrays
•
Improvements to CodeGen
•
Improvements to Layout
•
Improvements to Compilation Speed

41. Improvements to Arrays
•
Faster Creation
•
TypedArrays for numeric primitives
•
new int[64] => new Int32Array(64)

42. Improvements to CodeGen
•
Tune JS output for Modern JS VMs
•
Output asm.js-like code for increased
performance
•
Smaller code with Closure Backend

43. Improvements to Layout
•
“Native” Layout vs JS layout
•
CSS3 support through GssResource
•
Avoid constructs which “jank” browsers

44. Faster Compilation
•
Significantly faster incremental/modular draft
compilation
•
•
Speed proportional to # of changed files
Split Local/Global Optimizer

45. Improvements to
SuperDev Mode
SuperDev Mode
•
Faster refresh
•
Better debugging
•
IDE integration?

46. Fast
•
Faster Roundtripping in Compile cycle
•
Faster JS execution speed
•
Faster browser rendering

47. When?
•
GWT 3.0 tentatively scheduled for mid 2014.
•
Disclaimer: Not everything will make it for 3.0
•
Get Involved!