Alejandro Villanueva - Google Inc.

A More Powerful Web, Made Easier Alejandro Villanueva Developer Relations, Google June 5, 2009

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 Safari 4.0b: Mar 26, 2009 app cache Feb 29, 2009 canvas database canvas video workers XHR iPhone 2.2: video geolocation CSS Nov 22, 2008 app cache DOM canvas database HTML app cache workers 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 chrome firefox 3.1+ Monthly Contributors to OSS Browsers firefox 2.0-3.0 webkit 4 2002 2003 2004 2005 2006 2007 2008 2009

More Speed SunSpider Runs Per Minute 100x improvement in JavaScript performance 5 2001 2003 2005 2007 Q108 Q208 Q308 Q408 Q109

More Users OSS Browser Users (M) 2005 2006 2007 2008 2009

A More Powerful Web

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? 18

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

HTML 5 Support Chrome Firefox Safari Opera canvas video geolocation app cache database workers

Life’s Better with Location 2.8 mi Places Social Ads Games CRM Photos 2.1 mi 1.1 mi 500 ft 20 ft 28 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 Chrome Firefox Safari Opera canvas video geolocation (iPhone) app cache database workers

Web Apps Need to Work Everywhere 39

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

app cache & database demos

HTML 5 Support Chrome Firefox Safari Opera 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 I will not hose the browser with JavaScript I will not hose the browser with JavaScript I will not hose the browser with JavaScript I will not hose the browser with JavaScript I will not hose the browser with JavaScript

// web workers defines an API for running background scripts

web workers demos

HTML5 Support Chrome Firefox Safari Opera canvas video geolocation (iPhone) app cache (mobile) database (mobile) workers (mobile)

A More Powerful Web, Made Easier 49

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

200,000+ Developers 51

Google Apps + your apps Your custom Our Google Apps applications Google's scalable serving architecture

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

Announcing: Open Java Signups

Google Plugin for Eclipse

Secure Data Connector (SDC)

Secure Data Connector and 50+ more...

Your application's health

GWT Browser-Proofs Your JavaScript Code...

...But CSS Headaches Persist

Coming in GWT 2.0: In-Browser Debugging

GWT Debugging in the browser

Rich Applications, Extra-Large Codebases

LOADING 67

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

All together

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... Over 4B Google API Daily API Hits (B) Hits Every Day 74 May Jun Jul Aug Sept Oct Nov Dec Jan Feb Mar Apr May

...But Imagine AdSense for Everything Else Search Spreadsheets Video Calendars Maps 75

Announcing: Google Web Elements Copy and Paste Website Content 76

Google Web Elements demo

google.com/webelements

Android: Seven Months, By The Numbers • 10 carriers in 12 countries • 4,900+ applications in the Android Market • 40+ app downloads per user • #2 in U.S. mobile web browsing • 3 platform releases, and counting... 79

code.google.com/android

Summary 81

http://jujo00obo2o234ungd3t8qjfcjrs3o6k-a-sites-opensocial.googleusercontent.com	49
https://jujo00obo2o234ungd3t8qjfcjrs3o6k-a-sites-opensocial.googleusercontent.com	21
http://www.slideshare.net	17

Alejandro Villanueva - Google Inc.

by Alejandro Corpeño on Jun 10, 2009

Accessibility

Categories

Tags

Upload Details

Usage Rights

3 Embeds 87

Statistics

Alejandro Villanueva - Google Inc. — Presentation Transcript