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
ふつうの技術スタックでアート作品を作ってみる
akira888
1
830
なんとなくわかった気になるブロックテーマ入門/contents.nagoya 2025 6.28
chiilog
1
270
ISUCON研修おかわり会 講義スライド
arfes0e2b3c
1
440
Result型で“失敗”を型にするPHPコードの書き方
kajitack
5
650
A full stack side project webapp all in Kotlin (KotlinConf 2025)
dankim
0
120
イベントストーミング図からコードへの変換手順 / Procedure for Converting Event Storming Diagrams to Code
nrslib
2
800
おやつのお供はお決まりですか?@WWDC25 Recap -Japan-\(region).swift
shingangan
0
130
すべてのコンテキストを、 ユーザー価値に変える
applism118
3
1.3k
10 Costly Database Performance Mistakes (And How To Fix Them)
andyatkinson
0
330
今ならAmazon ECSのサービス間通信をどう選ぶか / Selection of ECS Interservice Communication 2025
tkikuc
21
4k
脱Riverpod?fqueryで考える、TanStack Queryライクなアーキテクチャの可能性
ostk0069
0
120
dbt民主化とLLMによる開発ブースト ~ AI Readyな分析サイクルを目指して ~
yoshyum
3
1k
Featured
See All Featured
Being A Developer After 40
akosma
90
590k
A Tale of Four Properties
chriscoyier
160
23k
A designer walks into a library…
pauljervisheath
207
24k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Music & Morning Musume
bryan
46
6.6k
Site-Speed That Sticks
csswizardry
10
690
How STYLIGHT went responsive
nonsquared
100
5.6k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Producing Creativity
orderedlist
PRO
346
40k
Building a Modern Day E-commerce SEO Strategy
aleyda
42
7.4k
Why You Should Never Use an ORM
jnunemaker
PRO
58
9.4k
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