Google Developer Days Brazil 2009 - Keynote

A More Powerful Web,
Made Easier
Patrick Chanezon, chanezon@google.com
Developer Advocate, Google

June 29, 2009, Sao Paulo
#gdd

Monday, June 29, 2009

“If we are at 150 percent on D-Day, I don't
see which country could trouble us apart
from Brazil, obviously, because they are the
only fearsome team as they have always
been”
Zinedine Zidane


The Web Platform is Accelerating

Chrome 2.0:
May 21, 2009
canvas
User Experience

Firefox 3.5b4: video
Apr 27, 2009 geolocation
canvas app cache
video database
geolocation workers
app cache
Android 1.5: database
Apr 13, 2009 workers
canvas
Opera Labs: geolocation
Mar 26, 2009 app cache
Safari 4.0b: canvas database
Feb 29, 2009 video workers
canvas
geolocation
XHR iPhone 2.2: video
CSS Nov 22, app cache
DOM 2008 database
canvas workers
HTML app cache
database

native web

1990 -- 2008 Q408 Q109 Q209 ...


And It’s Solving Key Developer Challenges

Graphics Location Storage Speed
User Experience

XHR

CSS
DOM

HTML

native web

1990 -- 2008 Q408 Q109 Q209 ...


More Developers
300
chrome
firefox 3.1+
Monthly Contributors to OSS Browsers

firefox 2.0-3.0
webkit
225

150

75

0
2002 2003 2004 2005 2006 2007 2008 2009


More Speed
80
SunSpider Runs Per Minute

60

100x improvement
in JavaScript performance
40

20

0
2001 2003 2005 2007 Q108 Q208 Q308 Q408 Q109


More Users
450

350
OSS Browser Users (M)

250

150

50
2005 2006 2007 2008 2009


A More Powerful Web

5>2

Cautionary Tales of Latent Lemonade

AJAX (2004)

xml (1998)

css xhr
(1996) (1999)


HTML 5: A Chance to Do Things Differently


canvas video geolocation app cache & web workers
database


Until Recently, You Couldn’t Draw on the Web

0
0 X

y

x

height
Y width


And Graphics Weren’t Very Interactive

javascript:onClick(Draw());


The Usual Options Do This...
Silverlight
VML
Flash


... But canvas is Intrinsic to the Web

Document Object Model (DOM) Specification
Original: http://www.w3.org/TR/REC-DOM-Level-1/
Latest: http://www.w3.org/TR/DOM-Level-3-Core/
Contributors: Netscape, Sun, Microsoft, W3C, IBM,
DOM Novell, JavaSoft, SoftQuad Inc., Inso EPS, Texcel
Research, Arbortext
Transparent Stack

Hypertext Markup Language (HTML)
Original: http://tools.ietf.org/html/rfc1866
Latest: http://www.w3.org/TR/html5/
HTML Contributors: T. Berners-Lee, D. Connolly, L. Masinter,
MIT, W3C, AT&T, IBM, Microsoft, Netscape, Novell,
SoftQuad, Spyglass, Adobe, Lotus, CWI, Reuters,
JavaSoft, HP, GRIF, Sun, Opera, Mozilla, Google, Apple

Hypertext Transfer Protocol (HTTP)
Original: http://tools.ietf.org/html/rfc1945
Latest: http://tools.ietf.org/html/rfc2616
Contributors: UC Urvine, Compaq, MIT, Xerox,
HTTP Microsoft, W3C, T. Berners-Lee, R. Fielding, J. Gettys,
J. Mogul, H. Frystyk, L. Masinter, P. Leach


// canvas
defines drawing
and animation
APIs with pixel-
level control


canvas demos


canvas Piggybacks Overall Browser Speed

SunSpider Runs Per Minute

Is the Web Ready for 3D?


code.google.com/apis/o3d


HTML 5 Support

Chrome Firefox Safari Opera

canvas

video

geolocation

app cache

database

workers


Video is Complicated, and Outside Your Control


So What
Would
Occam Do?

© topatoco.com


// HTML 5 makes
<video> as easy
as <img>


<video> demos


Life’s Better with Location
2.8 mi

Places

Social Ads Games
CRM Photos

2.1 mi
1.1 mi

500 ft

20 ft

75 ft

But GPS and IP Aren’t Good Enough

1. too slow
2. too constrained
3. too fuzzy


1) Cell ID and WiFi Solve The Data Problem...


2) ...And Browsers Are Now Location-Enabled


// the
geolocation api
brings browser-
based location
to your apps


canvas
video
geolocation
app cache and database
web workers

for more info: http://bit.ly/ff35dev

geolocation demos


HTML 5 Support


canvas

video

geolocation
(iPhone)

app cache

database

workers


Web Apps Need to Work Everywhere


// database and
app cache store
user data and
app resources
locally


app cache & database demos


HTML 5 Support


canvas

video

geolocation
(iPhone)

app cache
(mobile)

database
(mobile)

workers


A More Powerful Web == More Powerful Apps


But More Power == More Responsibility

I will not hose the browser with JavaScript







// web workers
defines an API
for running
background
scripts


web workers demos


HTML5 Support


canvas

video

geolocation
(iPhone)

app cache
(mobile)

database
(mobile)

workers
(mobile)


Open Standards in IE?
• IE does not implement html5 or SVG
• But there are open source projects which implement these
functionalities in IE on top of Flash or VML
– Canvas: Erik Arvidsson’s ExplorerCanvas
• http://code.google.com/p/explorercanvas/
– SVG: Brad Neuberg’s SVG Web
• http://code.google.com/p/sgweb/
– Video: Kroc Camen’s Video for Everybody
• http://camendesign.com/code/video_for_everybody
– Dean Edward’s html5.js
• not yet released
• These Javascript libraries allow developers to start using
Openweb technologies NOW!

51


OpenSocial


Large Reach

Over 800M in a year – and more to come!


Global Reach


OpenSocial Supporting Products

27 Google Confidential


Under the hood: Usage Stats

• 315M+ App Installs
• 85M+ Canvas Page Views / Day
• 7,500+ Apps
• 20+ Containers


The Open Stack

XRDS


Google Friend Connect


Google FriendConnect

• Uses OpenSocial
(gadgets, REST/RPC)
• Allows site owners to
mix in social data to
existing sites
• Cut and paste or
• Deep integrations


Google Friend Connect Demos


A More Powerful Web, Made Easier


App Engine and Google Web Toolkit (GWT)
Easier to Scale and Optimize Your App


200,000+
Developers

80,000+ Applications
700
9:30am EST:
WhiteHouse.gov Queries Per Second (QPS)

Deadline for
submissions
600
5:00pm EST:
Link on Google
homepage
500
11:30am EST:
Townhall begins

400
Afternoon EST:
NPR, NYTimes,
CNN coverage
300

200 6:45pm EST:
WhiteHouse.gov
kick-off blog post 5:00pm EST:
WhiteHouse.gov
wrap-up blog post
100

0
18:00 21:00 24:00 3:00 6:00 9:00 12:00 15:00 18:00 21:00 24:00 3:00 6:00 9:00 12:00 15:00 18:00 21:00 24:00 3:00


Launched in the Last 12 Months

X memcache API
X SSL support
X system status
X paid quota
X cron support
X database import
X java runtime

• Background processing
• Large object store
• Database export
• XMPP
• Incoming email

Java + App Engine demo


UI in the Front...

...Hosting in the Back


GWT Browser-Proofs Your JavaScript Code...

IE

Firefo
x

i
Safar

Chrome


...But CSS Headaches Persist


Coming in GWT 2.0: In-Browser Debugging


Rich Applications, Extra-Large Codebases


Manual Code Splitting: Not For the Faint of Heart


Coming in GWT 2.0: runAsync()

// example

public void onMySettingsLinkClicked() {

GWT.runAsync(new RunAsyncCallback() {

public void onSuccess() {
new MySettingsDialog().show();
}

public void onFailure(Throwable ohNoes) {
// indicate that something went wrong,
// usually a connectivity or server
problem
}
});
}


runAsync() Helps Apps Startup More Quickly
1500
1400 KB
Size of Initial JavaScript Download (KB)

1125

750
7x Decrease In
Initial Download Size
with runAsync()
375

200
KB
0
26-Nov 29-Apr 18-Jun 28-Jul 12-Sep 27-Oct 24-Dec 16-Mar


code.google.com/appengine
code.google.com/gwt


Google Product APIs
Easier to Add Content and Services To Your Website

Search Feeds Translation Calendar Video Comments News

Maps Charts Contacts Spreadsheets Photos Documents Auth


Low-Level API Access Serves Many Needs...
5

4

Over 4B Google API
Daily API Hits (B)

Hits Every Day
3

2

1
May Jun Jul Aug Sept Oct Nov Dec Jan Feb Mar Apr May


...But Imagine AdSense for Everything Else

Search Spreadsheets

Video Calendars Maps


Announcing: Google Web Elements
Copy and Paste Website Content


Google Web Elements demo
Localized in pt-br


google.com/webelements


Android: Seven Months, By The Numbers

• 10 carriers in 12 countries
• 5,000+ applications in the Android Market
• 40+ app downloads per user
• #2 in U.S. mobile web browsing
• 3 platform releases, and counting...


Google Technology User Groups (GTUGs)
• Only one in Brazil: Minas Gerais (MG)
• Get one started in Sao Paulo!

www.gtugs.org/
87


Summary


Google Developer Days Brazil 2009 - Keynote

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Andere mochten auch

Andere mochten auch (9)

Ähnlich wie Google Developer Days Brazil 2009 - Keynote

Ähnlich wie Google Developer Days Brazil 2009 - Keynote (20)

Mehr von Patrick Chanezon

Mehr von Patrick Chanezon (20)

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

Google Developer Days Brazil 2009 - Keynote