WebSockets et Atmosphere       Jeanfrancois Arcand       twitter.com/jfarcandfacebook.com/jeanfrancois.arcand.3
Who is Wordnik?• Founded in 2008 by Erin McKean• "Understand meaning of words  automatically"• Patented "Free-Range Defini...
Atmosphere Apache 2      Github ~450               « followers »                               Client +  Supporté         ...
Atmosphere Apache 2      Github ~450               « followers »                               Client +  Supporté    Très ...
WSJ.com• 40 millions de requêtes par jours• Atmosphere 0.9.4/Jetty 8.1.3• Websockets => long-polling => JSONP• IE 6/7/8/9/...
Mon WebSocket au Canada!        WebSocket
Mon WebSocket au Canada!             WebSocketC’est quoi
Mon WebSocket au Canada!             WebSocketC’est quoi               N’importe                            quoi!
Mon WebSocket au Canada!             WebSocketC’est quoi               N’importe                            quoi!         ...
Mon WebSocket au Canada!                WebSocket   C’est quoi               N’importe                               quoi!...
Mon WebSocket au Canada!                WebSocket   C’est quoi               N’importe                               quoi!...
WebSocketsLe protocole WebSocket vise àdévelopper un canal decommunication bidirectionnelet « full-duplex » sur unsocket T...
Avant (Long-Polling)               RequêteFureteu                          Server   r
Avant (Long-Polling)               RequêteFureteu                          Server   r
Avant (Long-Polling)               RequêteFureteu                          Server   r               Réponse
Oups!!          RequêteFureteu        Rien   Server   r
Oups!          RequêteFureteu             Server   r                    Zzzz
Mieux!          RequêteFureteu                 Server   r                      Cache
Mieux!          RequêteFureteu               Server   r                    Cache
A la limite (HTTP Streaming)            RequêteFureteu                    Server   r
A la limite (HTTP Streaming)            RequêteFureteu                    Server   r
A la limite (HTTP Streaming)            RequêteFureteu                    Server   r            Réponse
A la limite (HTTP Streaming)            RequêteFureteu                    Server   r            Réponse            Réponse
Oups!!           RequêteFureteu              Server   r  L’enfe   Réponse     r           Réponse
A la limite (HTTP Streaming)            RequêteFureteu                    Server   r  L’enfe   Hack     Réponse     r     ...
Oups!!!          RequêteFureteu              Server   r          Réponse             Proxy          Réponse
Mieux          RequêteFureteu                 Server   r          Réponse   Cache          Réponse
Mieux           RequêteFureteu                     Server   r          Réponse       Cache          «Réponse            He...
Mieux: Server Side Events (SSE)           RequêteFureteu                  Server   r           Réponse           Réponse
Oups!!!          RequêteFureteu              Server   r          Réponse             Proxy          Réponse
Mieux           RequêteFureteu                     Server   r          Réponse       Cache          «Réponse            He...
WebSockets           HanshakeFureteu                Server   r
WebSockets           HanshakeFureteu                Server   r             OK
WebSockets           RequêteFureteu                Server   r
WebSockets           RequêteFureteu                Server   r
WebSocketsFureteu                Server   r           Réponse
WebSockets           RequêteFureteu                Server   r
WebSockets           Requête            RequêteFureteu                Server   r
WebSockets           Requête            RequêteFureteu                Server   r
WebSocketsFureteu                Server   r           Réponse           Réponse
A TOUS momentFureteu                   Server   r             Réponse
Ah la belle vie, la vie, la vie ahah!Fureteu                       Server   r             Réponse
Oups!!Fureteu              Server   r          Réponse             Proxy
Mieux!Fureteu                 Server   r          Réponse   Cache
Première requêteT 127.0.0.1:65062 -> 127.0.0.1:8080 [AP]GET / HTTP/1.1.Upgrade: websocket.Connection: Upgrade.Host: 127.0....
RéponseT 127.0.0.1:8080 -> 127.0.0.1:51292 [AP]HTTP/1.1 101 Switching Protocols.Upgrade: WebSocket.Connection: Upgrade.Sec...
Ah la belle vie, la vie, la vie, ahahT 127.0.0.1:8080 -> 127.0.0.1:51292 [AP]HTTP/1.1 101 Switching Protocols.Upgrade: Web...
OUPS!!!T 127.0.0.1:8080 -> 127.0.0.1:65064 [AP]HTTP/1.1 501 Not Implemented.Server: Apache-Coyote/1.1.X-Atmosphere-error: ...
WebSocket API – Standard           JavaScriptwebsocket = new WebSocket(wsUri);websocket.onopen = function(evt) { …};websoc...
WebSocket API – JavaJetty 7, GlassFish 3.1, Netty 3, Tomcat7.0.27, Resin 4, JBoss PluginJSR 356:http://jcp.org/en/jsr/deta...
Ah la belle vie,la vie, la vie, ahah
OUPS!!!
C’est parti!Safari                   Tomcat                            7Firefox                  Jetty7                   ...
N’importe quoiSafari                     Tomcat                              7Firefox                    Jetty7           ...
N’importe quoiSafari                     Tomcat                              7Firefox                    Jetty7           ...
N’importe quoiSafari                         Tomcat                                  7          Streamin             Jetty...
N’importe quoiSafari                        Tomcat                                 7          Streamin            Jetty7Fi...
N’importe quoiSafari                         Tomcat                                  7          Streamin             Jetty...
N’importe quoiSafari                         Tomcat                                  7        Streamin               Jetty...
Safari                    Tomcat                             7Firefox                   Jetty7          Atmosphere àChrome...
Atmosphere -WebSocketsSafari                                        Tomcat                                                ...
Atmosphere - HTML5 Server Side               EventsSafari                                     Tomcat                      ...
Atmosphere Long-Polling/HTTP                StreamingSafari                                        JBoss                  ...
AtmosphereSafari                                                   JBoss                                                  ...
Socket.IO, GWT, Wicket, JSF, etc.Safari                                     JBoss                                         ...
PORTABLE!!!!!Safari                                             JBoss                                                   Je...
Grosse Erreur!!!!!• Toutframework ne supportant que les WebSockets     Mise en   production  IMPOSSIBLE
Atmosphere
Définition• Suspend: décrocher la ligne• Resume: racrocher la ligne• Broadcast: parler sur une ou plusieurs lignes, seul, ...
Requête NormaleFureteu   rFureteu                     Server   rFureteu   r
Requête NormaleFureteu   rFureteu                     Server   rFureteu   r
SuspendFureteu   rFureteu             Server   rFureteu   r
SuspendFureteu   r                    SFureteu              Server   rFureteu   r
SuspendFureteu   r                    SFureteu              Server   rFureteu   r
SuspendFureteu   r                    SFureteu              Server   rFureteu   r
BroadcastFureteu   r                               B                      SFureteu               Server   rFureteu   r
BroadcastFureteu   r                               B                      SFureteu               Server   rFureteu   r
ResumeFureteu   r                                BFureteu                Server   r               RFureteu   r
ResumeFureteu   r                                BFureteu                Server                   S   rFureteu   r
Broadcaster• Default:    in-memory• Nuage •   RedisBroadcaster •   JMSBroadcaster •   XMPPBroadcaster •   HazelcastBroadca...
Broadcaster NuageFureteu   r                          S                              ServerFureteu   rFureteu             ...
Broadcaster NuageFureteu   r                          S                              ServerFureteu   rFureteu             ...
Broadcaster NuageFureteu                                B   r                          S                              Serv...
Broadcaster NuageFureteu                             B   r                          ServerFureteu   rFureteu   r          ...
Broadcaster NuageFureteu   r                          ServerFureteu   r                                       BFureteu   r...
Broadcaster NuageFureteu   r                          ServerFureteu   rFureteu   r                          Server
Composantes Atmosphere• WebSocketHandler •   Seulement WebSocket (ATTENTION)!• AtmosphereHandler •   Tout les protocoles• ...
WebSocket Sub Protocol• WebSocketProtocol Definir sont propre WebSocket protocol.• Atmosphere,par default, utilise le Simp...
Construction d’une appli
Hello, Swagger• Swagger is… •   Spec for declaring an API schema •   A framework for auto-generating the spec •   A librar...
What is this Resource Declaration?• Listing of all available APIshttp://petstore.swagger.wordnik.com/api/resources.json   ...
Démo
But What about Speed?• Yes!   REST over HTTP is slow •   Connection overhead •                                 Your     Ma...
SwaggerSocket• REST over WebSocket• Protocole basé sur JSON• Performance améliorée• Simple• Supporte également sur HTTP.• ...
Powered By Wordnik           twitter.com/wordnik      twitter.com/atmo_framework       twitter.com/swaggersockethttp://git...
Upcoming SlideShare
Loading in …5
×

Introduction au WebSockets via le projet Atmosphere

2,124 views

Published on

Présentation d'Atmosphere, Swagger et SwaggerSocket

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
2,124
On SlideShare
0
From Embeds
0
Number of Embeds
8
Actions
Shares
0
Downloads
13
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Introduction au WebSockets via le projet Atmosphere

  1. 1. WebSockets et Atmosphere Jeanfrancois Arcand twitter.com/jfarcandfacebook.com/jeanfrancois.arcand.3
  2. 2. Who is Wordnik?• Founded in 2008 by Erin McKean• "Understand meaning of words automatically"• Patented "Free-Range Definition" technology• Constructed largest (known) English Word Graph We do Discovery – in real time!!
  3. 3. Atmosphere Apache 2 Github ~450 « followers » Client + Supporté serverpar + de 25frameworks Scala, Groovy, JRuby, Java Depuis 20 000 et plus 2008 téléchargement par1.0.0.beta1 mois!
  4. 4. Atmosphere Apache 2 Github ~450 « followers » Client + Supporté Très Très serverpar + de 25 actif!!!frameworks Scala, Groovy, JRuby, Java Depuis 20 000 et plus 2008 téléchargement par mois!
  5. 5. WSJ.com• 40 millions de requêtes par jours• Atmosphere 0.9.4/Jetty 8.1.3• Websockets => long-polling => JSONP• IE 6/7/8/9/10, Chrome XX, Firefox 3/12, Safari XX• WebSockets: IE 10, Chrome 14, Firefox 8, Safari 5
  6. 6. Mon WebSocket au Canada! WebSocket
  7. 7. Mon WebSocket au Canada! WebSocketC’est quoi
  8. 8. Mon WebSocket au Canada! WebSocketC’est quoi N’importe quoi!
  9. 9. Mon WebSocket au Canada! WebSocketC’est quoi N’importe quoi! Atmospher e
  10. 10. Mon WebSocket au Canada! WebSocket C’est quoi N’importe quoi! Atmospher eConcepts
  11. 11. Mon WebSocket au Canada! WebSocket C’est quoi N’importe quoi! Atmospher eConcepts Démo
  12. 12. WebSocketsLe protocole WebSocket vise àdévelopper un canal decommunication bidirectionnelet « full-duplex » sur unsocket TCP pour les fureteurset les serveurs web.
  13. 13. Avant (Long-Polling) RequêteFureteu Server r
  14. 14. Avant (Long-Polling) RequêteFureteu Server r
  15. 15. Avant (Long-Polling) RequêteFureteu Server r Réponse
  16. 16. Oups!! RequêteFureteu Rien Server r
  17. 17. Oups! RequêteFureteu Server r Zzzz
  18. 18. Mieux! RequêteFureteu Server r Cache
  19. 19. Mieux! RequêteFureteu Server r Cache
  20. 20. A la limite (HTTP Streaming) RequêteFureteu Server r
  21. 21. A la limite (HTTP Streaming) RequêteFureteu Server r
  22. 22. A la limite (HTTP Streaming) RequêteFureteu Server r Réponse
  23. 23. A la limite (HTTP Streaming) RequêteFureteu Server r Réponse Réponse
  24. 24. Oups!! RequêteFureteu Server r L’enfe Réponse r Réponse
  25. 25. A la limite (HTTP Streaming) RequêteFureteu Server r L’enfe Hack Réponse r Réponse
  26. 26. Oups!!! RequêteFureteu Server r Réponse Proxy Réponse
  27. 27. Mieux RequêteFureteu Server r Réponse Cache Réponse
  28. 28. Mieux RequêteFureteu Server r Réponse Cache «Réponse HeartBeat »
  29. 29. Mieux: Server Side Events (SSE) RequêteFureteu Server r Réponse Réponse
  30. 30. Oups!!! RequêteFureteu Server r Réponse Proxy Réponse
  31. 31. Mieux RequêteFureteu Server r Réponse Cache «Réponse HeartBeat »
  32. 32. WebSockets HanshakeFureteu Server r
  33. 33. WebSockets HanshakeFureteu Server r OK
  34. 34. WebSockets RequêteFureteu Server r
  35. 35. WebSockets RequêteFureteu Server r
  36. 36. WebSocketsFureteu Server r Réponse
  37. 37. WebSockets RequêteFureteu Server r
  38. 38. WebSockets Requête RequêteFureteu Server r
  39. 39. WebSockets Requête RequêteFureteu Server r
  40. 40. WebSocketsFureteu Server r Réponse Réponse
  41. 41. A TOUS momentFureteu Server r Réponse
  42. 42. Ah la belle vie, la vie, la vie ahah!Fureteu Server r Réponse
  43. 43. Oups!!Fureteu Server r Réponse Proxy
  44. 44. Mieux!Fureteu Server r Réponse Cache
  45. 45. Première requêteT 127.0.0.1:65062 -> 127.0.0.1:8080 [AP]GET / HTTP/1.1.Upgrade: websocket.Connection: Upgrade.Host: 127.0.0.1:8080.Origin: http://127.0.0.1:8080.Sec-WebSocket-Key: Tz9qdt3lmte6Slf+GvpRqQ==.Sec-WebSocket-Version: 13.Sec-WebSocket-Extensions: x-webkit-deflate-frame.
  46. 46. RéponseT 127.0.0.1:8080 -> 127.0.0.1:51292 [AP]HTTP/1.1 101 Switching Protocols.Upgrade: WebSocket.Connection: Upgrade.Sec-WebSocket-Accept:HVXA7SqH5uYeN6aD9tZ0JQbfTJA=.
  47. 47. Ah la belle vie, la vie, la vie, ahahT 127.0.0.1:8080 -> 127.0.0.1:51292 [AP]HTTP/1.1 101 Switching Protocols.Upgrade: WebSocket.Connection: Upgrade.Sec-WebSocket-Accept:HVXA7SqH5uYeN6aD9tZ0JQbfTJA=.
  48. 48. OUPS!!!T 127.0.0.1:8080 -> 127.0.0.1:65064 [AP]HTTP/1.1 501 Not Implemented.Server: Apache-Coyote/1.1.X-Atmosphere-error: Websocket protocol notsupported.Transfer-Encoding: chunked.Date: Fri, 15 Jun 2012 10:06:30 GMT.Connection: close..
  49. 49. WebSocket API – Standard JavaScriptwebsocket = new WebSocket(wsUri);websocket.onopen = function(evt) { …};websocket.onclose = function(evt) { …};websocket.onmessage = function(evt) { …};websocket.onerror = function(evt) { …};webSocket.send(…)
  50. 50. WebSocket API – JavaJetty 7, GlassFish 3.1, Netty 3, Tomcat7.0.27, Resin 4, JBoss PluginJSR 356:http://jcp.org/en/jsr/detail?id=356AHC (Client -> De facto)http://github.com/sonatype/async-http-client
  51. 51. Ah la belle vie,la vie, la vie, ahah
  52. 52. OUPS!!!
  53. 53. C’est parti!Safari Tomcat 7Firefox Jetty7 Jetty8Chrome GlassFisOpera h3. GlassFis IE h 312
  54. 54. N’importe quoiSafari Tomcat 7Firefox Jetty7 Jetty8Chrome GlassFisOpera h3. GlassFis IE h 312
  55. 55. N’importe quoiSafari Tomcat 7Firefox Jetty7 Au Jetty8Chrome Secours GlassFisOpera !! h3. GlassFis IE h 312
  56. 56. N’importe quoiSafari Tomcat 7 Streamin Jetty7Firefox g Au Jetty8Chrome Secours GlassFisOpera !! h3. GlassFis IE h 312
  57. 57. N’importe quoiSafari Tomcat 7 Streamin Jetty7Firefox g Au SSE Jetty8Chrome Secours GlassFisOpera !! h3. GlassFis IE h 312
  58. 58. N’importe quoiSafari Tomcat 7 Streamin Jetty7Firefox g Au SSE Jetty8Chrome Secours GlassFisOpera !! JSONP h3. GlassFis IE h 312
  59. 59. N’importe quoiSafari Tomcat 7 Streamin Jetty7Firefox g Au SSE Jetty8Chrome Secours GlassFis Opera !! JSONP h3. Long GlassFis IE Polling h 312
  60. 60. Safari Tomcat 7Firefox Jetty7 Atmosphere àChrome la Jetty8 rescousse!!! GlassFisOpera h3. GlassFis IE h 312
  61. 61. Atmosphere -WebSocketsSafari Tomcat 7 Jetty7 Atmosphere APIFirefox atmosphere.js Jetty8Chrome GlassFisOpera h3. GlassFis IE h 312
  62. 62. Atmosphere - HTML5 Server Side EventsSafari Tomcat 7 Jetty7 Atmosphere APIFirefox atmosphere.js ServletChrome 3 WebLogiOpera c GlassFis IE h 312
  63. 63. Atmosphere Long-Polling/HTTP StreamingSafari JBoss Jetty7 Atmosphere APIFirefox atmosphere.js ServletChrome 3 WebLogiOpera c. GlassFis IE h
  64. 64. AtmosphereSafari JBoss Jetty7 Atmosphere APIFirefox atmosphere.js Même API,Chrome peut importe Servlet 3 le transport!! WebLogiOpera c. GlassFis IE h
  65. 65. Socket.IO, GWT, Wicket, JSF, etc.Safari JBoss Jetty7 Atmosphere APIFirefox Socket.IO ServletChrome 3 WebLogiOpera c. GlassFis IE h
  66. 66. PORTABLE!!!!!Safari JBoss Jetty7 Atmosphere APIFirefox Socket.IO PORTABLE ServletChrome 3 WebLogiOpera c. GlassFis IE h
  67. 67. Grosse Erreur!!!!!• Toutframework ne supportant que les WebSockets Mise en production IMPOSSIBLE
  68. 68. Atmosphere
  69. 69. Définition• Suspend: décrocher la ligne• Resume: racrocher la ligne• Broadcast: parler sur une ou plusieurs lignes, seul, à deux ou plusieurs.
  70. 70. Requête NormaleFureteu rFureteu Server rFureteu r
  71. 71. Requête NormaleFureteu rFureteu Server rFureteu r
  72. 72. SuspendFureteu rFureteu Server rFureteu r
  73. 73. SuspendFureteu r SFureteu Server rFureteu r
  74. 74. SuspendFureteu r SFureteu Server rFureteu r
  75. 75. SuspendFureteu r SFureteu Server rFureteu r
  76. 76. BroadcastFureteu r B SFureteu Server rFureteu r
  77. 77. BroadcastFureteu r B SFureteu Server rFureteu r
  78. 78. ResumeFureteu r BFureteu Server r RFureteu r
  79. 79. ResumeFureteu r BFureteu Server S rFureteu r
  80. 80. Broadcaster• Default: in-memory• Nuage • RedisBroadcaster • JMSBroadcaster • XMPPBroadcaster • HazelcastBroadcaster • JGroupsBroascaster• Multi-Threads, Async I/O par default
  81. 81. Broadcaster NuageFureteu r S ServerFureteu rFureteu S Server r
  82. 82. Broadcaster NuageFureteu r S ServerFureteu rFureteu S Server r
  83. 83. Broadcaster NuageFureteu B r S ServerFureteu rFureteu S Server r
  84. 84. Broadcaster NuageFureteu B r ServerFureteu rFureteu r Server
  85. 85. Broadcaster NuageFureteu r ServerFureteu r BFureteu r Server
  86. 86. Broadcaster NuageFureteu r ServerFureteu rFureteu r Server
  87. 87. Composantes Atmosphere• WebSocketHandler • Seulement WebSocket (ATTENTION)!• AtmosphereHandler • Tout les protocoles• Jersey Resource • Tout les protocoles• Meteor • Tout les protocoles
  88. 88. WebSocket Sub Protocol• WebSocketProtocol Definir sont propre WebSocket protocol.• Atmosphere,par default, utilise le SimpleHttpProtocol Message WebSocket transformé en HTTP POST, avec read/write asynchrone.• SwaggerSocket:REST over WebSockets -> Protocol plus puissant
  89. 89. Construction d’une appli
  90. 90. Hello, Swagger• Swagger is… • Spec for declaring an API schema • A framework for auto-generating the spec • A library for client library generation • A JSON-based test framework
  91. 91. What is this Resource Declaration?• Listing of all available APIshttp://petstore.swagger.wordnik.com/api/resources.json “It’s like a sitemap for your API!”
  92. 92. Démo
  93. 93. But What about Speed?• Yes! REST over HTTP is slow • Connection overhead • Your Marshaling & Unmarshaling overhead prod • Chatter Database • JSON/XML need to diet isnt doing• Its also… REST • Synchronous • GET/POST/PUT/DELETE dont cut it
  94. 94. SwaggerSocket• REST over WebSocket• Protocole basé sur JSON• Performance améliorée• Simple• Supporte également sur HTTP.• Supporte le multi requètes/réponses.
  95. 95. Powered By Wordnik twitter.com/wordnik twitter.com/atmo_framework twitter.com/swaggersockethttp://github.com/Atmosphere/atmospherehttp://github.com/wordnik/swaggersocket

×