SlideShare a Scribd company logo
Websocket を知ろう
    @hogemaru7
もくじ
• Websocket とは
• 感想
• まとめ
つくったもののデモ
Websocket とは
• サーバとブラウザの間で双方向通信を
  行う技術
• RFC 6455
Websocket(ws) のレイヤ
         ー
ブラウザ対応状況
2010/2/4




2011/12
HTTP を用いた双方向通信
• Ajax (Polling)   • Comet(Long Polling)
Polling 型 (Ajax)




  サーバ側に更新がない場合に効率が悪い
Long Polling 型 (comet)




Polling より改善されているが、 http のヘッダ、
TCP のコネクションによるロスが残る
websocket
リソースの比較



               7 億倍




Websocket は些細な改善のように見えるが、ユーザが増えると・・・?
      http://ajax.sys-con.com/node/1315473
Websocket による通信の流
          れ

• HTTP でハンドシェイク
• Websocket でデータ転送
Websocket による通信の流
          れ
http によるハンドシェイク
Websocket による通信の流
          れ

• HTTP でハンドシェイク
• Websocket でデータ転送
データとフレーム
• Websocket はデータを転送する際、1つ
  またはそれ以上のフレームの連続として
  、データを転送する
 – フレームの順序や誤り訂正は TCP で保証され
   る
Websocket frame format
TCP Frame format




クイズ:ウェブソケットが挿入される場所はどこでしょう?
Websocket(ws) のレイヤ
         ー
データのマスク
• データは Masking-key を用いてマスク
  される
 – 主にセキュリティのため
 – Masking-key でペイロードが XOR 演算さ
   れる
より詳細な仕様が知りた
     い方
• Web や参考文献を読みましょう
個人的な感想
• ブラウザゲームは恩恵を受ける
 – windows の GUI アプリやゲームで使う意味はあ
   まりないかも (UDP/TCP のほうが良いはず )
• ユーザ数が多くなると性能差がはっきりする
 – 個人では検証が難しそう
• さまざまなデバイスをつなげたいときに便利
  そう
 – ブラウザで接続できる端末=利用可能なデバイス
 – 組織や家のプロキシを意識しなくてよい
まとめ
• Websocket について簡単に解説
 – これからは websocket って知ってる? 
   ときかれたときに知っている!と言えるは
   ず
• チャットアプリを作成して理解しまし
  た
 –   Node.js( サーバ ) + C#( クライアント )
 –   サーバ側: 50 行程度
 –   クライアント : 200 行程度
 –   作ってみると分かることもある
参考
• Html5 Tutorial:Web Sockets
  – http://marakana.com/bookshelf/html5_tutori
• Websocket をみてみよう
  – http://bit.ly/ws-kuruma

More Related Content

PDF
WebSocket / WebRTCの技術紹介
PDF
サーバPUSHざっくりまとめ
PDF
これから利用拡大?WebSocket
PPTX
再入門、サーバープッシュ技術
PDF
WebSocket Protocol と Plack::Middleware::WebSocket
PDF
Html5, Web Applications 2
PPTX
20110622 haruyama webso]cket
PDF
Janogia20120921 yoshinotakeshi
WebSocket / WebRTCの技術紹介
サーバPUSHざっくりまとめ
これから利用拡大?WebSocket
再入門、サーバープッシュ技術
WebSocket Protocol と Plack::Middleware::WebSocket
Html5, Web Applications 2
20110622 haruyama webso]cket
Janogia20120921 yoshinotakeshi

What's hot (18)

PDF
2012/6/10 Webのパフォーマンスを考える @ 【第三回】初心者向けホームページ勉強会
PDF
第2回Web技術勉強会 webパフォーマンス改善編
PPTX
AWSとmod_pagespeedで 楽々サクサク高速化!!
PPT
Study2study3 nslope
PDF
WTM52 あなたの作ったWEBサイト、生きてますか?
PDF
HttpとTelnetをつなぐ何か
PDF
第1回Webサーバ勉強会 - 212-223 ブラウザマッチ処理
PDF
Using SockJS(Websocket) with Sencha Ext JS
PPT
Webアプリケーションの無停止稼働
PPTX
WebSocketでリアルタイム通信 (第13回学生LT資料)
PDF
H2O - making HTTP better
PDF
Web基礎
PPTX
PDF
lua_nginx_module JSON-RPC 2.0 Batch Request
PDF
Windows azure webサイトの紹介
PPTX
Varnish
PDF
PHPからJavaへ乗り換えた。そんな昔話をしよう
PPTX
Webタグについて
2012/6/10 Webのパフォーマンスを考える @ 【第三回】初心者向けホームページ勉強会
第2回Web技術勉強会 webパフォーマンス改善編
AWSとmod_pagespeedで 楽々サクサク高速化!!
Study2study3 nslope
WTM52 あなたの作ったWEBサイト、生きてますか?
HttpとTelnetをつなぐ何か
第1回Webサーバ勉強会 - 212-223 ブラウザマッチ処理
Using SockJS(Websocket) with Sencha Ext JS
Webアプリケーションの無停止稼働
WebSocketでリアルタイム通信 (第13回学生LT資料)
H2O - making HTTP better
Web基礎
lua_nginx_module JSON-RPC 2.0 Batch Request
Windows azure webサイトの紹介
Varnish
PHPからJavaへ乗り換えた。そんな昔話をしよう
Webタグについて
Ad

Similar to websocket-survery (20)

PPTX
JavaプログラマのためのWebSocket概要
PDF
WebSocketを学ぼう!
PDF
HTML5など社内勉強会 Vol.8 - WebSocket
PDF
Nodejsによるwebsocket入門
PDF
HTML5と WebSocket / WebRTC / Web Audio API / WebGL 技術解説
PDF
Gtug girls meetup web socket handson
PDF
WebSocket + Node.jsでつくるチャットアプリ
PDF
WebSocketプロトコル
PDF
20120525 mt websocket
PDF
HTML5-pronama-study
PDF
AndroidでWebSocket
PDF
WebSocket Chat App Hands On on Microsoft Azure
PDF
Nodejs Introduction
PPTX
SL囲む会東京5 Nodejs×Silverlightではまったこと
PDF
リアルタイムweb入門
PDF
Web socketドロンくん その後-
PDF
最近、リアルタイムWebが面白い
PDF
いよいよ始められる Java EEでのWebSocket #jjug #jjug_ccc #ccc_r21
ODP
Node handson
PPTX
Real timeweb
JavaプログラマのためのWebSocket概要
WebSocketを学ぼう!
HTML5など社内勉強会 Vol.8 - WebSocket
Nodejsによるwebsocket入門
HTML5と WebSocket / WebRTC / Web Audio API / WebGL 技術解説
Gtug girls meetup web socket handson
WebSocket + Node.jsでつくるチャットアプリ
WebSocketプロトコル
20120525 mt websocket
HTML5-pronama-study
AndroidでWebSocket
WebSocket Chat App Hands On on Microsoft Azure
Nodejs Introduction
SL囲む会東京5 Nodejs×Silverlightではまったこと
リアルタイムweb入門
Web socketドロンくん その後-
最近、リアルタイムWebが面白い
いよいよ始められる Java EEでのWebSocket #jjug #jjug_ccc #ccc_r21
Node handson
Real timeweb
Ad

websocket-survery