Upload
eze-torres
View
1.510
Download
3
Tags:
Embed Size (px)
Citation preview
Wednesday, November 18, 2009
Browser, Mobile, Cloud, Social, GeoPortrait of the developer as a kid in a candy store
Patrick ChanezonDeveloper Advocate, Googlehttp://twitter.com/chanezon
November 17, 2009Argentina#devfest09
Source Marshall Astor http://www.flickr.com/photos/lifeontheedge/711086777/sizes/l/#cc_license
Wednesday, November 18, 2009
Las calles de Buenos Aires ya son mi entraña
“A mi se me hace cuento que empezo Buenos Aires:La juzgo tan eterna como el agua y el aire.”
“Hard to believe Buenos Aires had any beginning.I feel it to be as eternal as air and water”Fervor de Buenos Aires (1923)
Photo public domain http://commons.wikimedia.org/wiki/File:Jorge_Luis_Borges_Hotel.jpgWednesday, November 18, 2009
The Web Platform is AcceleratingU
ser E
xper
ienc
e
native web
1990 -- 2008 Q408 Q109 Q209 ...
iPhone 2.2:Nov 22, 2008canvasapp cachedatabase
Safari 4.0b:Feb 29, 2009canvasvideoapp cachedatabaseworkersHTML
DOMCSS
XHR
Opera Labs:Mar 26, 2009canvasvideogeolocation
Android 1.5:Apr 13, 2009canvasgeolocationapp cachedatabaseworkers
Firefox 3.5b4:Apr 27, 2009canvasvideogeolocationapp cachedatabaseworkers
Chrome 2.0:May 21, 2009canvasvideogeolocationapp cachedatabaseworkers
Wednesday, November 18, 2009
And It’s Solving Key Developer ChallengesU
ser E
xper
ienc
e
native web
HTML
DOMCSS
XHR
SpeedLocationGraphics Storage
1990 -- 2008 Q408 Q109 Q209 ...
Wednesday, November 18, 2009
More Developers
0
75
150
225
300
Mon
thly
Con
tribu
tors
to O
SS
Bro
wse
rs
2002 2003 2004 2005 2006 2007 2008 2009
webkitfirefox 2.0-3.0firefox 3.1+chrome
Wednesday, November 18, 2009
More Speed
0
20
40
60
80
Sun
Spi
der R
uns
Per
Min
ute
2001 2003 2005 2007 Q108 Q208 Q308 Q408 Q109
100x improvementin JavaScript performance
Wednesday, November 18, 2009
More Users
50
150
250
350
450
OS
S B
row
ser U
sers
(M)
2005 2006 2007 2008 2009
Wednesday, November 18, 2009
5>2A More Powerful Web
Wednesday, November 18, 2009
Cautionary Tales of Latent Lemonade
xhr(1999)
xml (1998)
css(1996)
AJAX (2004)
Wednesday, November 18, 2009
HTML 5: A Chance to Do Things Differently
Wednesday, November 18, 2009
canvas video geolocation app cache &database
web workers
Wednesday, November 18, 2009
00
width
heig
ht
Y
x
y
X
Until Recently, You Couldn’t Draw on the Web
Wednesday, November 18, 2009
And Graphics Weren’t Very Interactive
javascript:onClick(Draw());
Wednesday, November 18, 2009
The Usual Options Do This...
VMLFlash
Silverlight
Wednesday, November 18, 2009
... But canvas is Intrinsic to the WebTr
ansp
aren
t Sta
ck
DOM
Document Object Model (DOM) SpecificationOriginal: 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, Novell, JavaSoft, SoftQuad Inc., Inso EPS, Texcel Research, Arbortext
Hypertext Markup Language (HTML)Original: http://tools.ietf.org/html/rfc1866 Latest: http://www.w3.org/TR/html5/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/rfc1945Latest: http://tools.ietf.org/html/rfc2616Contributors: UC Urvine, Compaq, MIT, Xerox, Microsoft, W3C, T. Berners-Lee, R. Fielding, J. Gettys, J. Mogul, H. Frystyk, L. Masinter, P. Leach
HTTP
HTML
Wednesday, November 18, 2009
// canvas defines drawing and animation APIs with pixel-level control
Wednesday, November 18, 2009
canvas demos
Wednesday, November 18, 2009
Sun
Spi
der R
uns
Per
Min
ute
canvas Piggybacks Overall Browser Speed
Wednesday, November 18, 2009
Is the Web Ready for 3D?
Wednesday, November 18, 2009
Canvas3D, WebGLO3D code.google.com/apis/o3d
Wednesday, November 18, 2009
Chrome Firefox Safari Opera
canvas
video
geolocation
app cache
database
workers
HTML 5 Support
Wednesday, November 18, 2009
videocanvas geolocation app cache &database
web workers
Wednesday, November 18, 2009
Video is Complicated, and Outside Your Control
Wednesday, November 18, 2009
So What Would Occam Do?
© topatoco.com
Wednesday, November 18, 2009
// HTML 5 makes <video> as easy as <img>
Wednesday, November 18, 2009
<video> demos
Wednesday, November 18, 2009
Chrome Firefox Safari Opera
canvas
video
geolocation
app cache
database
workers
HTML 5 Support
Wednesday, November 18, 2009
geolocationcanvas video app cache &database
web workers
Wednesday, November 18, 2009
Life’s Better with Location
CRM Social Ads GamesPhotos
75 ft
20 ft
500 ft1.1 mi
2.1 mi
Places
2.8 mi
Wednesday, November 18, 2009
But GPS and IP Aren’t Good Enough
1. too slow2. too constrained3. too fuzzy
Wednesday, November 18, 2009
1) Cell ID and WiFi Solve The Data Problem...
Wednesday, November 18, 2009
Wednesday, November 18, 2009
2) ...And Browsers Are Now Location-Enabled
Wednesday, November 18, 2009
// the geolocation api brings browser-based location to your apps
Wednesday, November 18, 2009
geolocation demos
Wednesday, November 18, 2009
Chrome Firefox Safari Opera
canvas
video
geolocation
app cache
database
workers
HTML 5 Support
(iPhone)
Wednesday, November 18, 2009
app cache &database
canvas video geolocation web workers
Wednesday, November 18, 2009
Web Apps Need to Work Everywhere
Wednesday, November 18, 2009
// database and app cache store user data and app resources locally
Wednesday, November 18, 2009
app cache & database demos
Wednesday, November 18, 2009
Wednesday, November 18, 2009
<title>Google Maps</title><script src="/usr/lib/mojo/framework/mojo.js" type="text/javascript" x-mojo-version="1"> </script><script src="app/assistants/stage-assistant.js" type="text/javascript"></script>
this.controller.serviceRequest{ 'palm://com.palm.location', { method: "getFix", parameters: {mode: "auto"}, onSuccess: this.goFix, onFailure: this.error }};
index.html
map-assistant.js
Google Maps
Wednesday, November 18, 2009
webOS and HTML 5
• CSS Transformations
• HTML 5 database for history & bookmarks
• Canvas in calendar application
• Extensions- Accelerometer- ...
Wednesday, November 18, 2009
webOS Accelerometer API
• Shake: distinct start, stop with magnitude
• Orientation
• Raw acceleration- Individual acceleration per axis- Individual Pitch, Roll, and Yaw
• ... all available from JavaScript using the DOM Level 2 interface
Wednesday, November 18, 2009
Code Snippet
<script type="text/javascript"> // Set up accelerometer event handlers window.addEventListener( "shakestart", beginShaking, true ); window.addEventListener( "shaking", isShaking, true ); window.addEventListener( "shakeend", endShaking, true ); window.addEventListener( "acceleration", handleAccel, true ); function isShaking(event) { // event.magnitude // ... } function handleAccel(event) { // event.accelX, event.accelY, event.accelZ // event.pitch, event.roll, event.yaw // ... }</script>
Wednesday, November 18, 2009
webOS and HTML 5Converge mobile and desktopweb application development
Wednesday, November 18, 2009
Chrome Firefox Safari Opera
canvas
video
geolocation
app cache
database
workers
HTML 5 Support
(mobile)
(mobile)
(iPhone)
Wednesday, November 18, 2009
web workerscanvas video geolocation app cache &database
Wednesday, November 18, 2009
A More Powerful Web == More Powerful Apps
Wednesday, November 18, 2009
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
Wednesday, November 18, 2009
// web workers defines an API for running background scripts
Wednesday, November 18, 2009
web workers demos
Wednesday, November 18, 2009
Chrome Firefox Safari Opera
canvas
video
geolocation
app cache
database
workers
HTML5 Support
(iPhone)
(mobile)
(mobile)
(mobile)
Wednesday, November 18, 2009
HTML5 and SVG not available in IE?
• ChromeFrame plugin implements HTML5 in IE• Shim libraries using Flash or VML to implement features
– SVGWeb: SVG– Explorercanvas: Canvas– Video for Everybody: Video
55
Wednesday, November 18, 2009
Chrome Extensions
• Programs that enhance Google Chrome's functionality
• Written in HTML, CSS, and JavaScript
• Integrated using a simple API
• Developed iteratively
56
Wednesday, November 18, 2009
A More Powerful Web, Made Easier
Wednesday, November 18, 2009
Nubes
“¿Qué son las nubes? ¿Una arquitectura del azar? Quizá Dios las necesita para la ejecución de Su infinita obra y son hilos de la trama oscura. Quizá la nube sea no menos vana que el hombre que la mira en la mañana.”
“What are the clouds? An architecture of chance? Perhaps they are the necessary thingsfrom which God weaves his vast imaginings, threads of a web of infinite expanse. Maybe the cloud is emptiness returning, just like the man who watches it this morning.”Borges, Nubes II, Los Conjurados (1985)
Wednesday, November 18, 2009
App Engine and Google Web Toolkit (GWT)Easier to Scale and Optimize Your App
Wednesday, November 18, 2009
200,000+ Developers
Wednesday, November 18, 2009
80,000+ Applications
0
100
200
300
400
500
600
700
Wh
iteH
ou
se.g
ov Q
ue
ries P
er
Second (
QP
S)
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
6:45pm EST:WhiteHouse.govkick-off blog post
Afternoon EST:NPR, NYTimes,CNN coverage
5:00pm EST:Link on Googlehomepage
9:30am EST:Deadline forsubmissions
11:30am EST:Townhall begins
5:00pm EST:WhiteHouse.govwrap-up blog post
Wednesday, November 18, 2009
Launched in the Last 12 Months
memcache API
SSL supportsystem status
paid quota
cron support
database import
java runtime
X
X
X
X
X
X
XWednesday, November 18, 2009
Launched in the Last 2 Months
XMPP
Incoming email
Background processingX
X
X
X Datastore stats
Wednesday, November 18, 2009
• Large object store• Database export
Wednesday, November 18, 2009
Wednesday, November 18, 2009
Java + App Engine demo
Wednesday, November 18, 2009
...Hosting in the Back
UI in the Front...
Wednesday, November 18, 2009
GWT Browser-Proofs Your JavaScript Code...
IE
Firefox
Safari
Chrome
Wednesday, November 18, 2009
...But CSS Headaches Persist
Wednesday, November 18, 2009
Coming in GWT 2.0: In-Browser Debugging
Wednesday, November 18, 2009
Rich Applications, Extra-Large Codebases
Wednesday, November 18, 2009
LOADINGWednesday, November 18, 2009
Manual Code Splitting: Not For the Faint of Heart
Wednesday, November 18, 2009
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 } });}
Wednesday, November 18, 2009
runAsync() Helps Apps Startup More Quickly
26-Nov 29-Apr 18-Jun 28-Jul 12-Sep 27-Oct 24-Dec 16-Mar
Siz
e of
Initi
al J
avaS
crip
t Dow
nloa
d (K
B)
375
750
1125
1500
0
7x Decrease InInitial Download Sizewith runAsync()
1400 KB
200 KB
Wednesday, November 18, 2009
code.google.com/appenginecode.google.com/gwt
Wednesday, November 18, 2009
OpenSocial
Wednesday, November 18, 2009
Wednesday, November 18, 2009
Large Reach
Over 800M in a year – and more to come!
Wednesday, November 18, 2009
Global Reach
Wednesday, November 18, 2009
OpenSocial Supporting Products
27 Google Confidential
Wednesday, November 18, 2009
Under the hood: Usage Stats
• 315M+ App Installs
• 85M+ Canvas Page Views / Day
• 7,500+ Apps• 20+ Containers
Wednesday, November 18, 2009
The Open Stack
XRDS
Wednesday, November 18, 2009
Google Friend Connect
Wednesday, November 18, 2009
Google FriendConnect
•Uses OpenSocial (gadgets, REST/RPC)
•Allows site owners to mix in social data to existing sites
•Cut and paste or•Deep integrations
Wednesday, November 18, 2009
Google Friend Connect Demos
Wednesday, November 18, 2009
TIME.com Daily Specials
TIME.com’s Daily Specials provide a trusted and entertaining perspective on relevant current events.
These interactive specials use photo and video galleries to engage the readers, and topics can range from important international events like the Pope visiting the Middle East) to light hearted topics like the Best iPhone Apps.
Recent Popular Daily Specials Pageviews• top 10 disastrous letterman interviews - 7.4mm• top 11 iphone applications - 5.9mm•10 things you can like about $4 gas - 4.3mm•10 essential sites - 3.0mm
Source: Omniture SiteCatalyst – Past 12 Months
Wednesday, November 18, 2009
Specials Traffic
176MM From January – April 2009
Wednesday, November 18, 2009
Challenge
How can we make our daily Top 10’s more fun and engaging?
Wednesday, November 18, 2009
Wednesday, November 18, 2009
TIME Social Lists Demo
Wednesday, November 18, 2009
Architecture
Javascript APIs
JSONP
HTML + JavaScript
Wednesday, November 18, 2009
Wednesday, November 18, 2009
Paul Berry, HuffingtonPost
Wednesday, November 18, 2009
Wednesday, November 18, 2009
Wednesday, November 18, 2009
Google Product APIsEasier to Add Content and Services To Your Website
Search Feeds Translation Calendar
Maps Charts Contacts Documents
Comments
AuthPhotos
NewsVideo
Spreadsheets
Wednesday, November 18, 2009
Data Liberation Front http://www.dataliberation.org/
Users should be able to control the data they store in any of Google's products. Our team's goal is to make it easier to move data in and out.
Wednesday, November 18, 2009
Low-Level API Access Serves Many Needs...
1
2
3
4
5
Dai
ly A
PI H
its (B
)
May Jun Jul Aug Sept Oct Nov Dec Jan Feb Mar Apr May
Over 4B Google APIHits Every Day
Wednesday, November 18, 2009
...But Imagine AdSense for Everything Else
Maps
SpreadsheetsSearch
Video Calendars
Wednesday, November 18, 2009
Announcing: Google Web ElementsCopy and Paste Website Content
Wednesday, November 18, 2009
Google Web Elements demo
Wednesday, November 18, 2009
google.com/webelements
Wednesday, November 18, 2009
Android: Seven Months, By The Numbers
• 30+ carriers in 21 countries
•18-20 devices by the end of 2009
• 12,000+ applications in the Android Market
• 40+ app downloads per user
• #2 in U.S. mobile web browsing
• 4 platform releases, and counting...
Wednesday, November 18, 2009
code.google.com/android
Wednesday, November 18, 2009
Google Wave
• Real time communication and collaboration platform• Rich set of APIs
– Embedding– Gadgets– Robots– Extensions
• Open Source protocol, Wave federation• Open Source server
104
Wednesday, November 18, 2009
code.google.com/apis/wave
Wednesday, November 18, 2009
Go language
• A systems programming language– expressive– concurrent– garbage-collected
• New• Experimental• Fast• Safe• Concurrent• Open Source
106
Wednesday, November 18, 2009
golang.org
Wednesday, November 18, 2009
Enjoy the candies!http://twitter.com/chanezon
Source Marshall Astor http://www.flickr.com/photos/lifeontheedge/711086777/sizes/l/#cc_license
Mobile
Geo
Browser
SocialCloud
Demos at http://delicious.com/chanezon/devfest09+demos
Wednesday, November 18, 2009
Wednesday, November 18, 2009