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
120
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
86
Tailoring Mentorship (with speaker notes)
jwallace
0
280
Tailoring Mentorship (only slides)
jwallace
0
360
Trusty URIs
jwallace
0
87
Navigating Your Options for Mobile App Development
jwallace
1
100
Effective Debugging - Big Nerd Ranch Tech Talk
jwallace
2
170
Effective Debugging Rubyconf
jwallace
2
270
Importance of IS in Startups
jwallace
0
35
Chef and puppet
jwallace
0
77
Other Decks in Programming
See All in Programming
TiDB Serverless ~理想のServerless DBを考える~
soso_15315
1
160
ドメイン駆動設計の実践
masuda220
PRO
17
5.1k
CSC307 Lecture 14
javiergs
PRO
0
220
Temporalを取り巻く仕様を整理する
sajikix
0
110
入社1ヶ月でここまでやった!Findy Toolsインフラ支援の最適化
rvirus0817
6
1.4k
AWSでゲームサーバーを運用! Amazon GameLiftのお話
iriikeita
0
200
CSC307 Lecture 13
javiergs
PRO
0
150
みんなのオブザーバビリティプラットフォームを作ってるんだがパフォーマンスがやばい #mackerelio #srenext
ne_sachirou
0
370
開発部に不満を持っていたCSがエンジニアにジョブチェンしてわかった「勝手に諦めない」ことの大切さ
sakuraikotone
28
16k
君たちはどうコードをレビューする (される) か / 大吉祥寺.pm
utgwkk
15
8.5k
Harnessing Large Language Models for Training-free Video Anomaly Detection
tereka114
1
1.3k
ぼっちを避けて楽しむためのアノテコノテ / Various Tips and Tricks to Avoid Loneliness and Have Fun
nrslib
3
1.7k
Featured
See All Featured
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
78
15k
The Illustrated Children's Guide to Kubernetes
chrisshort
39
47k
Web Components: a chance to create the future
zenorocha
307
41k
The Pragmatic Product Professional
lauravandoore
29
6.1k
ParisWeb 2013: Learning to Love: Crash Course in Emotional UX Design
dotmariusz
105
6.8k
The Straight Up "How To Draw Better" Workshop
denniskardys
229
130k
Adopting Sorbet at Scale
ufuk
71
8.8k
Optimising Largest Contentful Paint
csswizardry
18
2.6k
A Modern Web Designer's Workflow
chriscoyier
689
190k
What's new in Ruby 2.0
geeforr
338
31k
For a Future-Friendly Web
brad_frost
173
9.2k
Pencils Down: Stop Designing & Start Developing
hursman
118
11k
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