Best Practices for Architecting GWT App

Best Practices for Architecting GWT App

Ryan:
Hello. My name is Ray.

And I'll be talking
to you today

about GWT application
architecture best practices.

We tried to find a drier title,
but this is the one that won.

I am stunned, amazed,
and flattered

that you all are here
when you could be eating lunch

or learning about Wave,

so thank you very much
for showing up.

I was going to go
get lunch myself if you hadn't.

So, I'll warn you also

that all of my rehearsals
of this have run long.

And I've responded to that
by adding more slides

to the presentation,
so I'm probably going to do

a lot of mumbling
and a lot of talking fast.

And we'll see where it goes.

So what are we talking about
today?

This is about
how to put together

a nontrivial GWT application.

Something that you
actually want to ship.

Something that
you're going to have

more than two or three people
at a time working on

without stomping
on each other's toads.

Toes.

We're going to look,
in particular,

at the client side,

because that's where I tend
to pay attention.

And what we're really
exploring here

are lessons that were learned
over the past year

building the new AdWords
user interface.

AdWords is a small product
at Google.

You may have heard of it.

And it's recently been--
the user interface of that

has been revamped
from the ground up

as a GWT application.

But first, let's go

to the last slide
of the presentation.

If you take nothing else
away today,

there are three things that you
really want to remember.

First thing, which I'm not going
to talk about much at all,

but still,
you want to remember it,

get your browser history right,
and get it right early.

One of the first things
that you should nail down

on your app
if you want it to work

is what the back button
and the forth button

are going to do to your users,

how they're going
to be bookmarking things.

GWT gives you a very nice
history library

to take care of that,

and if you apply it early,
it's easy.

If you apply it
after the fact,

and try to retrofit it in,
not so easy.

The next takeaway point
is you're going to use

an Event Bus as the backbone
of your application

to let yourself--
let you make sure

that the left hand of your app

has no more
than a nodding acquaintance

with the right hand
of your app.

Preferably
through conversations

brokered by
a neutral third party.

And then finally, you're going
to start saying to yourself,

"DI + MVP FTW."

Which is to say,
dependency injection

and the Model/View/Presenter
pattern for the win.

And I promise that that'll all
make a lot more sense

in about 50 minutes or so.

So let us start
with a demonstration

of the app that I mentioned,
the AdWords UI.

Which I, of course,
forgot to cue up.

So give me a moment
to rectify that situation.

Yeah.

We might just blow off
this part of it

if I can't
get my act together here.

There it is.

And it has decided to reload.

Good.

So this is live right now.

I'm looking
at the production site.

If I run into glitches here,
there are people

in ten countries
around the world,

a number of users--

which number I have been
cautioned not to disclose--

but they'd notice.

You can see that this is
a pretty traditional kind of

table full of data
sort of app.

But we've got
nice little widgets

like the GWT Incubator
tree view, fast tree view,

helping us guide our way
through things here.

Our users are going to do things
using the paging scrolling table

from the GWT Incubator to make
lots of edits of their data.

Maybe several fields at once
in that kind of a thing.

Or I might want to type around
and change my matching

and change my CPC.

I forget what that means,
actually,

although this
is my live account.

So I'm not going to actually
commit any of these changes

that I'm making.

They might take advantage
of the GWT visualization stuff

that you might have
learned about yesterday

to show graphs and such.