Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Socket.IO 1.0

Socket.IO 1.0

Guillermo Rauch

June 14, 2012
Tweet

More Decks by Guillermo Rauch

Other Decks in Programming

Transcript

  1. Thursday, June 14, 12

  2. Thursday, June 14, 12

  3. Guillermo Rauch Thursday, June 14, 12

  4. @rauchg Thursday, June 14, 12

  5. devthought.com Thursday, June 14, 12

  6. learnboost.com Thursday, June 14, 12

  7. started career in open-source Thursday, June 14, 12

  8. creator of socket.io realtime framework Thursday, June 14, 12

  9. MongoDB monk and mongoose ORM Thursday, June 14, 12

  10. distribute, up, browserbuild, juice & others Thursday, June 14, 12

  11. Author of Smashing Node Thursday, June 14, 12

  12. buy it Thursday, June 14, 12

  13. HTML5 WebSockets Thursday, June 14, 12

  14. socket.io Thursday, June 14, 12

  15. socket.io 1.0 Thursday, June 14, 12

  16. wow Thursday, June 14, 12

  17. websockets Thursday, June 14, 12

  18. RFC 6455 = The WebSocket Protocol Thursday, June 14, 12

  19. new WebSocket Thursday, June 14, 12

  20. but not just messages Thursday, June 14, 12

  21. also streams of data Thursday, June 14, 12

  22. problema numero #1 Thursday, June 14, 12

  23. different protocols in each browser Thursday, June 14, 12

  24. Chrome Thursday, June 14, 12

  25. good guy IE10 Thursday, June 14, 12

  26. iOS 4.2, Safari, Opera = older, more insecure protocol Thursday,

    June 14, 12
  27. Firefox uses MozWebSocket Thursday, June 14, 12

  28. websocket.io to the rescue Thursday, June 14, 12

  29. wow Thursday, June 14, 12

  30. meanwhile, in the real world Thursday, June 14, 12

  31. we need cross-browser, cross-platform support Thursday, June 14, 12

  32. socket.io to the rescue Thursday, June 14, 12

  33. a little history Thursday, June 14, 12

  34. In 2007, AppJet starts a Rhino-based SSJS app cloud Thursday,

    June 14, 12
  35. The most important predecessor to Node.JS Thursday, June 14, 12

  36. With AppJet, an application called etherpad is written Thursday, June

    14, 12
  37. Thursday, June 14, 12

  38. Thursday, June 14, 12

  39. Thursday, June 14, 12

  40. Thursday, June 14, 12

  41. etherpad does two things differently Thursday, June 14, 12

  42. 1. It’s a realtime web application based on long-polling Thursday,

    June 14, 12
  43. Unlike every other implementation since NES… Thursday, June 14, 12

  44. JS is no longer a PHP-style response handler Thursday, June

    14, 12
  45. 2. etherpad truly benefits from a single language Thursday, June

    14, 12
  46. Let’s go on a tangent Thursday, June 14, 12

  47. Realtime collaboration is all about state syncing Thursday, June 14,

    12
  48. The algorithm that merges changes is called OT Thursday, June

    14, 12
  49. Thursday, June 14, 12

  50. Thursday, June 14, 12

  51. Thursday, June 14, 12

  52. My name is John Thursday, June 14, 12

  53. My name is John My name is John User A

    User B Thursday, June 14, 12
  54. My name is John My name is John User A

    User B #1 #1 Thursday, June 14, 12
  55. My name is John My name is John User A

    User B #1 #1 concurrently Thursday, June 14, 12
  56. My name is John My name is John User A

    User B #1 #1 concurrently My name is John Hello Thursday, June 14, 12
  57. My name is John My name is John User A

    User B #1 #1 concurrently My name is John Hello My name is John Doe Thursday, June 14, 12
  58. My name is John My name is John User A

    User B #1 #1 concurrently My name is John Hello My name is John Doe 1. Go to position 0 and remove 10 characters Thursday, June 14, 12
  59. My name is John My name is John User A

    User B #1 #1 concurrently My name is John Hello My name is John Doe 1. Go to position 0 and remove 10 characters 2. Add “Hello” at position 0 Thursday, June 14, 12
  60. My name is John My name is John User A

    User B #1 #1 concurrently My name is John Doe { “rev”: 1, “ops“: [ { “type“: “delete”, “pos”: 0, “length”: 10 } , { “type“: “add”, “pos”: 0, “text”: “Hello” } ]} Thursday, June 14, 12
  61. My name is John My name is John User A

    User B #1 #1 concurrently { “rev”: 1, “ops“: [ { “type“: “delete”, “pos”: 0, “length”: 10 } , { “type“: “add”, “pos”: 0, “text”: “Hello” } ]} { “rev”: 1, “ops“: [ { “type“: “add”, “text”: “ Doe”, “pos”: 15 } ]} Thursday, June 14, 12
  62. #3 John Hello Doe Thursday, June 14, 12

  63. 1. Go to position 0 and remove 10 characters 2.

    Add “Hello” at position 0 3. Add “ Doe” at position 15 Thursday, June 14, 12
  64. 1. Go to position 0 and remove 10 characters 2.

    Add “Hello” at position 0 1. Add “ Doe” at position 15 || Thursday, June 14, 12
  65. 1. Go to position 0 and remove 10 characters 2.

    Add “Hello” at position 0 3. Add “ Doe” at position 10 Thursday, June 14, 12
  66. 1. Go to position 0 and remove 10 characters 2.

    Add “Hello” at position 0 3. Add “ Doe” at position (15 - 10 + 5) Thursday, June 14, 12
  67. 1. Go to position 0 and remove 10 characters 2.

    Add “Hello” at position 0 3. Add “ Doe” at position (15 - 10 + 5) 1 Thursday, June 14, 12
  68. 1. Go to position 0 and remove 10 characters 2.

    Add “Hello” at position 0 3. Add “ Doe” at position (15 - 10 + 5) 2 Thursday, June 14, 12
  69. 1. Go to position 0 and remove 10 characters 2.

    Add “Hello” at position 0 3. Add “ Doe” at position 10 Thursday, June 14, 12
  70. Operational Transformations are executed both on the server and the

    client Thursday, June 14, 12
  71. The server keeps its own representation of the document Thursday,

    June 14, 12
  72. and only relays operations to clients as JSON Thursday, June

    14, 12
  73. JavaScript allows you write the rules once Thursday, June 14,

    12
  74. but long-polling is awful Thursday, June 14, 12

  75. Wave Thursday, June 14, 12

  76. it’s evident the web needs something better for realtime Thursday,

    June 14, 12
  77. Ian Hickson or hixie Thursday, June 14, 12

  78. Thursday, June 14, 12

  79. websocket Thursday, June 14, 12

  80. socket.io is born Thursday, June 14, 12

  81. at first as a websocket API Thursday, June 14, 12

  82. but then gained crucial features for web app dev Thursday,

    June 14, 12
  83. XML Thursday, June 14, 12

  84. XML JSON Thursday, June 14, 12

  85. events Thursday, June 14, 12

  86. multiplexing Thursday, June 14, 12

  87. who uses it Thursday, June 14, 12

  88. gree Thursday, June 14, 12

  89. zynga Thursday, June 14, 12

  90. Thursday, June 14, 12

  91. socket.io Thursday, June 14, 12

  92. yammer Thursday, June 14, 12

  93. zendesk Thursday, June 14, 12

  94. trello Thursday, June 14, 12

  95. flightaware Thursday, June 14, 12

  96. cloud9 Thursday, June 14, 12

  97. socket.io gained some weight Thursday, June 14, 12

  98. “I love the 500 lines of embedded Flash websocket emulation

    code in the socket.io-client” said no one ever Thursday, June 14, 12
  99. engine.io meets socket.io Thursday, June 14, 12

  100. very clear goals Thursday, June 14, 12

  101. 1. upgrade instead of fallback Thursday, June 14, 12

  102. Thursday, June 14, 12

  103. connects right away on every browser and every network Thursday,

    June 14, 12
  104. then probe WebSocket on the side Thursday, June 14, 12

  105. we can lazy-load Flash - yay! Thursday, June 14, 12

  106. 2. multi-core support Thursday, June 14, 12

  107. Thursday, June 14, 12

  108. Thursday, June 14, 12

  109. require(‘cluster’) Thursday, June 14, 12

  110. FD socket.io socket socket.io socket socket.io socket socket.io socket require(‘cluster’)

    FD FD FD Thursday, June 14, 12
  111. sorry, no Thursday, June 14, 12

  112. req socket.io socket require(‘cluster’) req WS Thursday, June 14, 12

  113. 3. websocket compatible Thursday, June 14, 12

  114. same API on the server as websocket.io Thursday, June 14,

    12
  115. same API on the client as WebSocket Thursday, June 14,

    12
  116. 4. lightweight Thursday, June 14, 12

  117. 6kb minified + gzipped Thursday, June 14, 12

  118. as a result, new socket.io client is 300LOC Thursday, June

    14, 12
  119. Socket.IO 1.0 = engine.io + webscale + simple Thursday, June

    14, 12
  120. cdn.socket.io Thursday, June 14, 12

  121. new website Thursday, June 14, 12

  122. Release date = Node 0.8 Thursday, June 14, 12

  123. Thursday, June 14, 12

  124. Thursday, June 14, 12

  125. Thursday, June 14, 12

  126. questions? Thursday, June 14, 12