google web toolkit (gwt)a78khan/cs446/lectures/2011_06-jun_08_g… · rpc remote procedure call...

22
WATERLOO CHERITON SCHOOL OF COMPUTER SCIENCE Google Web Toolkit (GWT) Google Web Toolkit (GWT) Architectural Impact Architectural Impact on on Web Applications” Web Applications” CS 446/646 ECE452 Jun 8 th , 2011 IMPORTANT NOTICE TO STUDENTS These slides are NOT to be used as a replacement for student notes. These slides are sometimes vague and incomplete on purpose to spark class discussions

Upload: others

Post on 21-May-2020

3 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

Google Web Toolkit (GWT)Google Web Toolkit (GWT)““Architectural Impact Architectural Impact 

on on Web Applications”Web Applications”

CS 446/646 ECE452Jun 8th, 2011

IMPORTANT NOTICE TO STUDENTS

These slides are NOT to be used as a replacement for student notes.These slides are sometimes vague and incomplete on purpose to spark class discussions

Page 2: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

2WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

First Generation

Client Tier Server Tier

W

W

Web

W

CGI-Scripts DataSource

Data Tier

HTTP request(URL or Form posting)

HTTP response(HTML Document)

Page 3: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

3WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

First GenerationShortcomings● lack of a coherent architectural model

– development = adhoc composition of scripts – limited interaction between scripts

● evolution– how do you evolve scripts?– written in different languages

● data/information sharing– has to be via an external repository– difficult to control transactions

Page 4: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

4WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

First GenerationShortcomings● security

– CGI based scripts still a nightmare for admins– scripts are executed in native environment

● server execution environment is directly exposed● vulnerabilities in server code are also exposed

● throughput– a script launches a process – so what?

● tight coupling– each view is coupled to its corresponding script

Page 5: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

5WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

Second Generation

Client Tier Server Tier

Presentation JEE Container

W

W

J

J

Web

W

JEE Server

Servlet

Services

JDBC

DataSource

Data Tier

HTTP request(URL or Form posting)

HTTP response(HTML Document)

Page 6: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

6WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

Second GenerationShortcomings● server focused

– almost all improvements are on the server side● client tier

– still based on primitives● HTML, javascript, CSS etc.

– not dynamic● request-response cycle

– worse than first generation ???

Page 7: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

7WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

GWT

SG + AJAX = GWT

Not Exactly

AJAX: Asynchronous JavaScript and XML

Page 8: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

8WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

GWTGWT is a lot more than that● a paradigm shift away from

– traditional (web application) building blocks– synchronous communication

● built on standards– integrates well with existing server applications & web

services● composite building blocks

– HTML, javascript etc are low-level primitives● separation of concerns

Page 9: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

9WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

GWT Components

JREEmulator

Java-JSCompiler

JSNI

Async RPC

GWTServlet Ext

RPC manager

widgets

XML/JSON

i18N

Browser Integration

Core

Browser Runtime Environment

Page 10: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

10WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

Java­JS CompilerConverts Java to Javascript● src-to-src compiler● high level typed language to a script language

– does this make sense???● JS code optimization

– browser engines– size– security / obfuscation– localization

Page 11: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

11WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

JRE EmulatorEmulates● core Java classes in Javascript

Composite building blocks● allows for building composite building blocks● client tier built on

– composite building blocks rather than low level primitives

Page 12: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

12WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

JSNIJava Script Native Interface● wrapper

– for Javascript inside Java code● extension point

– for integration with non GWT client components

Have we seen of this before?

Page 13: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

13WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

RPCRemote Procedure Call● replaces HTTP

– for communication after app boot● asynchronous – why?

– breaks the request-response cycle● supports various protocols

– Ajax, JSON, GWT

RPC- getName()

RPC- getId()

getId()

getName()

Time

t0

t1

t2

t3

Page 14: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

14WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

Servlet ExtensionExtension of JEE Servlet● integration point with JEE application

– get all the JEE benefits for free● server component

– facade for business functionality● evolution

– highly flexible

Page 15: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

15WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

GWT Components

JREEmulator

Java-JSCompiler

JSNI

GWTServlet Ext

RPC manager

widgets

XML/JSON

i18N

Browser Integration

Core

Browser Runtime Environment

async RPC

Page 16: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

16WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

ImpactScalability

Reusability

Interoperability

Design by contract

Evolution

Development

Page 17: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

17WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

ScalabilityImprovement in server performance● (near) stateless servers

– client tier components truly reside in client tier– previously

● the state was maintained on the presentation tier● the view was rendered on the client tier

● optimized communication strategy– via aggregation of control/data exchange– decrease in server load– better bandwidth usage

Page 18: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

18WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

ReusabilityApplication● single code base to support

– multiple browser engines– internationalization

● i18N versions of the applications

● application broken over reusable modules

Design & development● OOD

– what benefits do we get from OOD?

Page 19: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

19WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

InteroperabilityIntegration / Extension points● Javascript native interface (JSNI)

– a layer of abstraction for integrating Javascript● third party & legacy Javascript libraries

● server side integration– servlet extension

● plugs into the JEE platform● also possible for other platforms

– mashups● use of diverse web services

Page 20: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

20WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

Design by ContractClient tier standardization● browser runtime environment (BRE)

– client code has to abide by the BRE interface– similar enhancement that JEE brought to server tier– isn't that strong coupling between GWT and an

application client code?● preserves the architectural integrity

Page 21: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

21WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

EvolutionOrganic growth● OOA & OOD

– what does this buy us?– OO Javascript

Rich Internet Applications (RIA)● HTML & HTTP as the basic building primitive● prevails where others failed

– Java applet, ActiveX, Adobe flex

Page 22: Google Web Toolkit (GWT)a78khan/cs446/lectures/2011_06-jun_08_G… · RPC Remote Procedure Call replaces HTTP – for communication after app boot asynchronous – why? – breaks

22WATERLOOCHERITON SCHOOL OFCOMPUTER SCIENCE

DevelopmentJava based Development● well established

– development tools & environments● IDEs, profiling

– testing strategies● skill-set standardization

– Java developers already exist