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.

1. 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

2. [www.flickr.com/photos/moragcasey/]
Who needs Web Push to a mobile phone?
MOTIVATION
2

3. 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

4. [ www.flickr.com/photos/docman ]
Web Sockets? Quesako?
BACKGROUND
4

5. 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 6

7. 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!)
[www.wikipedia.org]
7

8. [ www.flickr.com/photos/dhedwards ]
Using Mobile Web Push today… for Java Developers!
TOOLS
8

9. Atmosphere
> Atmosphere is a great Server Version Websocket
Support
portable “Web Push”
Glassfish >3.1 Yes (not
framework
default)
– Transparent deployment Tomcat 7 No (but NIO)
across App/Web Servers
Jetty > 8 M2 Yes
(Grizzly/Glassfish, Jetty,
JBoss, etc.) Grizzly 2 Yes
> JQuery Plugin as a portable
“Web Push” client
I’m just a happy user, check it out
– Transparent usage across here: http://atmosphere.java.net/
browsers, even for mobile
apps (e.g., using Sencha
Touch) 9

10. [www.flickr.com/photos/lpettinati]
Let’s get our hands dirty
DEMONSTRATION
10

11. 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

12. Mobile Websocket Client
> 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!
12

13. App & Tomcat 6.26: Uses HTTP Streaming
13

14. App & Jetty 8.0 M2: True Websocket Connection
14

15. Architecture of the Demo
15

16. 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

17. Thanks for your attention!
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