Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Websockets
Search
Jonathan Wallace
February 05, 2013
Programming
2
130
Websockets
Review websockets, what they are and give a simple example
Jonathan Wallace
February 05, 2013
Tweet
Share
More Decks by Jonathan Wallace
See All by Jonathan Wallace
Modern Data Literacy
jwallace
0
120
Tailoring Mentorship (with speaker notes)
jwallace
0
330
Tailoring Mentorship (only slides)
jwallace
0
430
Trusty URIs
jwallace
0
120
Navigating Your Options for Mobile App Development
jwallace
1
130
Effective Debugging - Big Nerd Ranch Tech Talk
jwallace
2
200
Effective Debugging Rubyconf
jwallace
2
320
Importance of IS in Startups
jwallace
0
64
Chef and puppet
jwallace
0
110
Other Decks in Programming
See All in Programming
“いい感じ“な定量評価を求めて - Four Keysとアウトカムの間の探求 -
nealle
1
7.3k
新メンバーも今日から大活躍!SREが支えるスケールし続ける組織のオンボーディング
honmarkhunt
3
5.2k
A2A プロトコルを試してみる
azukiazusa1
2
1.3k
AI時代のソフトウェア開発を考える(2025/07版) / Agentic Software Engineering Findy 2025-07 Edition
twada
PRO
61
17k
20250628_非エンジニアがバイブコーディングしてみた
ponponmikankan
0
660
Porting a visionOS App to Android XR
akkeylab
0
270
Select API from Kotlin Coroutine
jmatsu
1
220
Kotlin エンジニアへ送る:Swift 案件に参加させられる日に備えて~似てるけど色々違う Swift の仕様 / from Kotlin to Swift
lovee
1
260
ふつうの技術スタックでアート作品を作ってみる
akira888
0
430
生成AIコーディングとの向き合い方、AIと共創するという考え方 / How to deal with generative AI coding and the concept of co-creating with AI
seike460
PRO
1
350
なんとなくわかった気になるブロックテーマ入門/contents.nagoya 2025 6.28
chiilog
1
260
なぜ適用するか、移行して理解するClean Architecture 〜構造を超えて設計を継承する〜 / Why Apply, Migrate and Understand Clean Architecture - Inherit Design Beyond Structure
seike460
PRO
3
740
Featured
See All Featured
Six Lessons from altMBA
skipperchong
28
3.9k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
Building Flexible Design Systems
yeseniaperezcruz
328
39k
How STYLIGHT went responsive
nonsquared
100
5.6k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
It's Worth the Effort
3n
185
28k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
How to Ace a Technical Interview
jacobian
277
23k
A Modern Web Designer's Workflow
chriscoyier
694
190k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Transcript
WebSockets and Server Sent Events Tuesday, February 5, 13
WebSockets a̶n̶d̶ ̶S̶e̶r̶v̶e̶r̶ ̶S̶e̶n̶t̶ ̶E̶v̶e̶n̶t̶s̶ Tuesday, February 5, 13
WebSockets Tuesday, February 5, 13
Get to know me! • software developer (Ruby, Rails, C,
etc) • http://blog.jonathanrwallace.com/about •
[email protected]
• @jonathanwallace • All around swell guy Tuesday, February 5, 13
Tuesday, February 5, 13
Nature of HTTP • stateless • clients send requests •
servers respond to requests Tuesday, February 5, 13
Tuesday, February 5, 13
“Bi-directional” communication • Comet • Long polling - “you got
anything for me?” • Really only two, “streaming” and “long polling” Tuesday, February 5, 13
Issues? Tuesday, February 5, 13
Long polling Issues? • Header Overhead • Maximal Latency •
Connection Establishment • Allocated Resources • Graceful Degradation • Timeouts • Caching Tuesday, February 5, 13
Streaming Issues? • Framing Techniques • Client Buffering • Network
Intermediaries • Maximal Latency Tuesday, February 5, 13
WebSockets: how they work • client sends specially formatted HTTP
request to server • server must support websocket protocol • that connection is upgraded to a websocket and you can send anything up and down that connection Tuesday, February 5, 13
Tuesday, February 5, 13
Specially formatted request 1 <script text='javascript'> 2 var ws =
new WebSocket('ws://example.com:8080'); 3 </script> Tuesday, February 5, 13
Client side responsibilities 1 <script text='javascript'> 2 # ... 3
ws.onmessage = function(evt) { 4 $("#msg").append("<p>"+evt.data+"</p>"); 5 }; 6 ws.onclose = function() { debug("socket closed"); }; 7 ws.onopen = function() { 8 debug("connected..."); 9 ws.send("hello server"); 10 }; 11 # ... 12 </script> Tuesday, February 5, 13
WebSockets support? Tuesday, February 5, 13
Tuesday, February 5, 13
Tuesday, February 5, 13
Ruby WebSockets server 1 require 'rubygems' 2 require 'em-websocket' 3
4 EventMachine::WebSocket.start( 5 :host => "0.0.0.0", :port => 8080) do |ws| 6 ws.onopen { ws.send "Hello Client!"} 7 ws.onmessage { |msg| ws.send "Pong: #{msg}" } 8 ws.onclose { puts "WebSocket closed" } 9 end Tuesday, February 5, 13
What can you send over WebSockets? Tuesday, February 5, 13
Tuesday, February 5, 13
WebSockets Demo Tuesday, February 5, 13
Tuesday, February 5, 13
Credits • http://www.html5rocks.com/en/tutorials/websockets/basics/ • http://www.html5rocks.com/en/tutorials/eventsource/basics/ • http://tenderlovemaking.com/2012/07/30/is-it-live.html • http://www.ibm.com/developerworks/library/wa-reverseajax1/ •
http://tools.ietf.org/html/draft-loreto-http-bidirectional-07 • https://github.com/igrigorik/em-websocket • http://www.igvita.com/2009/12/22/ruby-websockets-tcp-for-the- browser/ Tuesday, February 5, 13
Images • http://www.flickr.com/photos/67828440@N05/galleries/ 72157632691816485/with/2985066755/#photo_2985066755 • http://betterexplained.com/articles/how-to-optimize-your- site-with-gzip-compression/ Tuesday, February 5,
13
Get to know me! • software developer (Ruby, Rails, C,
etc) • http://blog.jonathanrwallace.com/about •
[email protected]
• @jonathanwallace • All around swell guy Tuesday, February 5, 13