html5, websockets & the mobile web
DESCRIPTION
Showing how websockets can be used already today to push data to mobile Web apps. Focusing on a Java developer view-point, looking at using the Atmosphere Java framework with several java app servers and a Sencha Touch frontend.TRANSCRIPT
Time to Push to the Mobile Web!
HTML5, Websockets, Mobile Web and Java!
Dominique Guinard
ETH Zurich / MIT Auto-ID Labs
Java Track 8.2
MOTIVATIONWho needs Web Push to a mobile phone?
2
[www.flickr.com/photos/moragcasey/]
Mobile Monitoring of RFID Data
> Use-case:
– Simple Web app to monitor RFID
readers
– Scan and run (no install)
– Real-time push
> General idea:
– No app / install & Cross device
– Real-world monitoring apps
– Lightweight (near) real-time
3
BACKGROUNDWeb Sockets? Quesako?
4
[ www.flickr.com/photos/docman ]
The Problem: (a History of Web Push Hacks)
> Long-polling (Comet)
– Request – Wait – Request
> HTTP Streaming
– Connect – Keepalive
> …
> 101 of how to DoS a thread-
blocking Webserver.
5
6
The Solution: (HTML5) Websockets
> Bi-directional & full duplex connection
on a single TCP socket.
> Direct support in the browser.
> NAT, Firewall and (Proxy) traversal
http://jazoon.com/2010/Conference/Wednesday/Lubbers
The Solution: (HTML5) Websockets cont’d
> Client in 9 lines of
Javascript
> Neat! But:
– DRAFT, DRAFT & DRAFT!
– Different browsers support
– Safari for iOS 4.2 is the only
mobile browser supporting it
(more coming soon!)
7
[www.wikipedia.org]
TOOLSUsing Mobile Web Push today… for Java Developers!
8
[ www.flickr.com/photos/dhedwards ]
Atmosphere
> Atmosphere is a great
portable “Web Push”
framework
– Transparent deployment
across App/Web Servers
(Grizzly/Glassfish, Jetty,
JBoss, etc.)
> JQuery Plugin as a portable
“Web Push” client
– Transparent usage across
browsers, even for mobile
apps (e.g., using Sencha
Touch) 9
I’m just a happy user, check it out
here: http://atmosphere.java.net/
Server Version Websocket
Support
Glassfish >3.1 Yes (not
default)
Tomcat 7 No (but NIO)
Jetty > 8 M2 Yes
Grizzly 2 Yes
DEMONSTRATIONLet’s get our hands dirty
10
[www.flickr.com/photos/lpettinati]
PubSub Server with Atmosphere
> A cross-server PubSub in a
few lines:
– Deployable in Jetty, Tomcat,
Glassfish, JBoss, etc.
> Smoothly combines with
REST and JAX-RS (Jersey)
11
Mobile Websocket Client
12
> Based on the Atmosphere
JQuery Plugin
– Cross browser!
> Mobile App flavor with
Sencha Touch
> RFID tags read by the
reader are pushed to the
mobile Web app!
App & Tomcat 6.26: Uses HTTP Streaming
13
App & Jetty 8.0 M2: True Websocket Connection
14
Architecture of the Demo
15
Take home!
> Web Push enables new apps
– Also for the mobile Web (e.g., with Sencha Touch, Jo, etc.)!
– No install, cross-platform
– Real-world monitoring apps
– Short-living interactions with real-time requirements
> HTML5 Websockets are not quite here yet
– Wide support in the Web galaxy (Node.js, Socket.io, Pusherapp, etc.)
– Emerging support in the Java galaxy…
– Glassfish / Grizzly, Jetty and cont’d
– Atmosphere and the JQuery plugin is of great help for client and server
portability!
> Websockets also exist beyond the browser, e.g. for Android/Java
16
Dominique Guinard home: guinard.org
ETH Zurich / MIT Auto-ID Labs blog: webofthings.com
twitter: @domguinard
Tools/links mentioned in this talk on:
delicious.com/misterdom/jazoon2011
Thanks for your attention!