GWT . CreateA Fast and Lightweight Future

Ray Cromwellhttps://plus.google.com/+RayCromwell

Welcome

State of the Community

State of GWT

GWT 3.0 and Beyond

State of the Community

700+ attending GWT.create

3x increase in external contributions (patches)

Thousands of Googlers using it

~100k users of SDK

Looking for Sexy?

Cool New Products using GWT

Google Shopping Express

New Google Sheets

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.

Google Sheets Much faster than predecessor

Larger Sheets

Local client formula evaluation

Offline

Faster, smoother, scrolling

Supported on all 3 platforms at once.

State of GWT

GWT 2.6

Java 7

Reduced Code Size

Better CodeSplitter

Ambitious plan for upcoming improvements

Whats Happened Since 2006

JS a lot faster

Browsers much more capable

Less incompatibility between latest versions

Kraken 2200% Faster

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

Compatibility

Mobile Expectations

About 50% of web traffic is now mobile

Native apps have influenced consumers to expect jank-free experience

GWT 3.0 And Beyond

Fast and Lightweight

Lightweight Syntax

Full Java 8 language support

No Lambda

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

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

With Lambda

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

Vs Javascript

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

Lightweight Js Interop

Call Javascript without JSNI

@JsInterface, @JsProperty

Js Library Sample

function MyClass() { this.answer = 42;}

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

function MyClass() { this.answer = 42;}

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

Without JsInterfaceinterface 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(); }-*/;}

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(); }-*/;}

With JsInterface

@JsInterfaceinterface MyClass { @JsProperty int getAnswer(); String whatIsTheAnswer();}

@JsInterfaceinterface MyClass { @JsProperty int getAnswer(); String whatIsTheAnswer();}

Zero Work Interop

Could we make this even easier?

Zero Work Interop

Closure Compiler annotated Javascript

Typescript annotated JavaScript

Drop in and go

Automatically generate JsInterface declarations from typed JS

Demo

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

The World Today

Host Html Page

GWT SourceGWT SourceGWT SourceGWT Source

GWT GWT CompilerCompiler

GWT GWT CompilerCompiler

Compiled JSCompiled JSCompiled JSCompiled JS

GWT Module IFrame

Radically Better Interop

Combine JS and Java as single source tree

Globally Optimize Together

Output single, optimized application

The World Tomorrow

Host Html Page

GWT SourceGWT SourceGWT SourceGWT Source

GWT GWT CompilerCompiler

GWT GWT CompilerCompiler

Compiled JSCompiled JSCompiled JSCompiled JS

GWT Module IFrame

The World Tomorrow

GWT SourceGWT SourceGWT SourceGWT Source

GWT GWT CompilerCompiler

GWT GWT CompilerCompiler

Compiled JSCompiled JSCompiled JSCompiled JS

GWT Module IFrame

Closure Closure CompilerCompilerClosure Closure

CompilerCompiler

Radically Better Interop

Javascript library subject to optimizations together with Java code

Smallest code size possible

Type-checking between JS and Java

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

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

Fire and Forget CodeSpliting

CodeSplitter allows code to be not be loaded until needed

Reduces initial download size

Shared code leftovers fragment inhibits benefits

Current Problem

Tedious

Brittle

Lack of Control

Next-Gen CodeSplitter

Choose to force a split point manually

Automatically merge fragments

Multiple leftover fragments

Back to Basics

Simplicity

Radically Simpler Interop with JavaScript

Targeting Modern Browser Capabilities

Emphasis on Mobile

Fast

Improvements to Arrays

Improvements to CodeGen

Improvements to Layout

Improvements to Compilation Speed

Improvements to Arrays

Faster Creation

TypedArrays for numeric primitives

new int[64] => new Int32Array(64)

Improvements to CodeGen

Tune JS output for Modern JS VMs

Output asm.js-like code for increased performance

Smaller code with Closure Backend

Improvements to Layout

Native Layout vs JS layout

CSS3 support through GssResource

Avoid constructs which jank browsers

Faster Compilation

Significantly faster incremental/modular draft compilation

Speed proportional to # of changed files

Split Local/Global Optimizer

Improvements toSuperDev ModeSuperDev Mode

Faster refresh

Better debugging

IDE integration?

Fast

Faster Roundtripping in Compile cycle

Faster JS execution speed

Faster browser rendering

When?

GWT 3.0 tentatively scheduled for mid 2014.

Disclaimer: Not everything will make it for 3.0

Get Involved!