Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
LWPG: The Future Is Realtime
miksago
October 20, 2011
Programming
4
990
LWPG: The Future Is Realtime
A slightly more technical version of the The Future Is Realtime talk I've been doing recently.
miksago
October 20, 2011
Tweet
Share
More Decks by miksago
See All by miksago
Introducing Realtime - Node.js Dublin
miksago
3
370
KRTConf: WebSockets & Sub-Protocols
miksago
1
620
Reject.js: The Future is Realtime
miksago
3
480
Cognac.js - Testing on the Rocks
miksago
2
160
London Ajax: The Future Is Realtime
miksago
3
160
LDNJS 05 - Node
miksago
6
270
Other Decks in Programming
See All in Programming
xarray-Datatree: Hierarchical Data Structures for Multi-Model Science
tomnicholas
0
210
Amebaブログの会員画面システム刷新の道程
ryotasugawara
1
210
CDKでValidationする本当の方法 / cdk-validation
gotok365
1
180
はてなリモートインターンシップ2022 Web API 講義資料
hatena
0
150
Gradle build: The time is now
nonews
1
430
ITエンジニア特化型Q&Aサイトteratailを 言語、DB、クラウドなど フルリプレイスした話
leveragestech
0
390
Hasura の Relationship と権限管理
karszawa
0
160
ECテックカンファレンス2023
kspace
1
220
TokyoR#103_DataProcessing
kilometer
0
520
LIFFで動く割り勘アプリTATEKAをリリースしてみた話
inoue2002
0
230
AWS App Runnerがそろそろ本番環境でも使い物になりそう
n1215
PRO
0
900
低レイヤーから始める GUI
fadis
18
9.3k
Featured
See All Featured
A better future with KSS
kneath
230
16k
Teambox: Starting and Learning
jrom
124
7.9k
The Illustrated Children's Guide to Kubernetes
chrisshort
22
42k
Git: the NoSQL Database
bkeepers
PRO
418
60k
A designer walks into a library…
pauljervisheath
198
16k
Facilitating Awesome Meetings
lara
33
4.6k
Building a Modern Day E-commerce SEO Strategy
aleyda
6
4.5k
Designing for humans not robots
tammielis
245
24k
JazzCon 2018 Closing Keynote - Leadership for the Reluctant Leader
reverentgeek
175
9.1k
Gamification - CAS2011
davidbonilla
75
4.1k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
13
1.1k
Mobile First: as difficult as doing things right
swwweet
213
7.8k
Transcript
Micheil Smith - @miksago The future is realtime
I work at Pusher BUILDING THE REALTIME WEB
• Part 1: Background & History • Part 2: Using
the Realtime Web
• Part 1: Background & History • Part 2: Using
the Realtime Web
• Part 1: Background & History • Overview of the
past • The Shift to Realtime • Realtime Web in Action
• Overview of the past • The Shift to Realtime
• Realtime Web in Action
• Early web • PHP / LAMP Stack • MVC
• Social Web Overview of the past
http://www.mikealrogers.com/posts/a-new- direction-for-web-applications-.html Overview of the past
• Overview of the past • The Shift to Realtime
• Realtime Web in Action
The Shift to Realtime • The web has become more
interactive • Users expect things to be “now” • And why should they have to wait?
• We researched page-load time • We used AJAX to
decrease wait-time on interactions • We then tried to simulate “realtime” with AJAX and related technologies The Shift to Realtime
The Simulations of Realtime • HTTP Polling • LiveConnect •
Forever iFrame • XHR Long-polling • XHR Streaming
A more complete history http://blog.pusher.com/2011/8/10/what- came-before-websockets
Going Properly Realtime • HTML5 Introduces many new API’s •
One of those is WebSockets
What are WebSockets? • Bi-directional socket connection between browser and
server • API is fairly low level • Low-latency/high-frequency messaging
The Uses of WebSockets • Progressively Realtime Applications • Entirely
Realtime Applications • Multiplayer HTML5 Gaming
• Overview of the past • The Shift to Realtime
• Realtime in Action
Progressively Realtime Apps CloudApp Tastebuds
Collaborative Editing Codr.cc Google Docs
Realtime Analytics Guag.es
Realtime HTML5 Gaming Rawkets Metris
There’s a lot more uses...
...and even more that we haven’t thought of yet.
• Part 1: Background & History • Part 2: Using
the Realtime Web
var socket = new WebSocket('ws://localhost:8080/') socket.onopen = function() { /*...*/
}; socket.onmessage = function(messageEvent) { /*...*/ }; socket.onclose = function(closeEvent) { /*...*/ }; socket.onerror = function() { /*...*/ }; socket.send('my data'); The WebSocket API
var socket = new WebSocket(url, protocol) var socket = new
WebSocket(url, [protocol1, protocol2]) socket.addEventListener('open', function() { /*...*/ }); socket.addEventListener('message', /*...*/ ); socket.addEventListener('close', /*...*/ ); socket.addEventListener('error', /*...*/ ); The WebSocket API (alt)
WebSocket Servers • worlize/WebSocket-node • miksago/node-websocket-server • oberstet/Autobahn (python) •
igrigorik/em-websocket (ruby) • Jetty/7.5.2 (java) • ostinelli/misultin (erlang)
Warning! There are currently multiple versions of WebSockets supported by
Browsers, not all of the previously listed Servers support all the versions.
Extra’s!
Portland, OR 7th & 8th November http://krtconf.com Keeping It Realtime
Conference
Questions?
Thanks for listening! @miksago on Twitter / Github / Geekli.st