Websocket を知ろう    @hogemaru7
もくじ• Websocket とは• 感想• まとめ
つくったもののデモ
Websocket とは• サーバとブラウザの間で双方向通信を  行う技術• RFC 6455
Websocket(ws) のレイヤ         ー
ブラウザ対応状況2010/2/42011/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...
参考• Html5 Tutorial:Web Sockets  – http://marakana.com/bookshelf/html5_tutori• Websocket をみてみよう  – http://bit.ly/ws-kuruma
Upcoming SlideShare
Loading in …5
×

websocket-survery

1,337 views

Published on

websocket survery.

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,337
On SlideShare
0
From Embeds
0
Number of Embeds
290
Actions
Shares
0
Downloads
10
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

websocket-survery

  1. 1. Websocket を知ろう @hogemaru7
  2. 2. もくじ• Websocket とは• 感想• まとめ
  3. 3. つくったもののデモ
  4. 4. Websocket とは• サーバとブラウザの間で双方向通信を 行う技術• RFC 6455
  5. 5. Websocket(ws) のレイヤ ー
  6. 6. ブラウザ対応状況2010/2/42011/12
  7. 7. HTTP を用いた双方向通信• Ajax (Polling) • Comet(Long Polling)
  8. 8. Polling 型 (Ajax) サーバ側に更新がない場合に効率が悪い
  9. 9. Long Polling 型 (comet)Polling より改善されているが、 http のヘッダ、TCP のコネクションによるロスが残る
  10. 10. websocket
  11. 11. リソースの比較 7 億倍Websocket は些細な改善のように見えるが、ユーザが増えると・・・? http://ajax.sys-con.com/node/1315473
  12. 12. Websocket による通信の流 れ• HTTP でハンドシェイク• Websocket でデータ転送
  13. 13. Websocket による通信の流 れhttp によるハンドシェイク
  14. 14. Websocket による通信の流 れ• HTTP でハンドシェイク• Websocket でデータ転送
  15. 15. データとフレーム• Websocket はデータを転送する際、1つ またはそれ以上のフレームの連続として 、データを転送する – フレームの順序や誤り訂正は TCP で保証され る
  16. 16. Websocket frame format
  17. 17. TCP Frame formatクイズ:ウェブソケットが挿入される場所はどこでしょう?
  18. 18. Websocket(ws) のレイヤ ー
  19. 19. データのマスク• データは Masking-key を用いてマスク される – 主にセキュリティのため – Masking-key でペイロードが XOR 演算さ れる
  20. 20. より詳細な仕様が知りた い方• Web や参考文献を読みましょう
  21. 21. 個人的な感想• ブラウザゲームは恩恵を受ける – windows の GUI アプリやゲームで使う意味はあ まりないかも (UDP/TCP のほうが良いはず )• ユーザ数が多くなると性能差がはっきりする – 個人では検証が難しそう• さまざまなデバイスをつなげたいときに便利 そう – ブラウザで接続できる端末=利用可能なデバイス – 組織や家のプロキシを意識しなくてよい
  22. 22. まとめ• Websocket について簡単に解説 – これからは websocket って知ってる?  ときかれたときに知っている!と言えるは ず• チャットアプリを作成して理解しまし た – Node.js( サーバ ) + C#( クライアント ) – サーバ側: 50 行程度 – クライアント : 200 行程度 – 作ってみると分かることもある
  23. 23. 参考• Html5 Tutorial:Web Sockets – http://marakana.com/bookshelf/html5_tutori• Websocket をみてみよう – http://bit.ly/ws-kuruma

×