More Related Content
Similar to Node.js で SPDYのベンチマーク体験サイトを作りました
Similar to Node.js で SPDYのベンチマーク体験サイトを作りました (20)
More from shigeki_ohtsu (6)
Node.js で SPDYのベンチマーク体験サイトを作りました
- 2. 自己紹介
• 所属:株式会社 インターネットイニシアティブ
• アプリケーション開発部 戦略的開発室
• Node.js, HTML5, Kinect, SPDY etc..
• 流行しそうなものを検証・評価してます。
• twitter: @jovi0608
• github: https://github.com/shigeki
- 4. 今日のネタ
• node-spdy を使って、 SPDY のベンチマークを
体験できるサイトを作りました。
• spdy/3.1 (per-session flow control) のネタも考
えていましたが、やめました。
– 「twitterが spdy/3.1 の試験を始めてます」
– http://d.hatena.ne.jp/jovi0608/20130327/136435
7687
- 5. SPDYベンチマーク体験サイト
• ssl, spdy/3, spdy3+ server push で同じページが表示さ
れる時間を定量的に比較できます。(以前は spdy2 も
ベンチしていましたが、ブラウザがほぼspdy/3対応に
なったので取り止め)
• ベンチマークページは単に画像を並べただけ
• 画像数は 10~90。(100以上は後述)
• キャッシュしないようセッション化。
• ChromeはTCPをすぐ切らないのでベンチ終了後に0.5
秒後に強制切断。
• 手動ステップでベンチすることにより見え方の違いも
体験できます。
• 時間測定は、Navigation Timing API を使って取得。
- 6. Navigation Timing APIで見るSPDY
domContentLoaded
EventEnd loadEventStart
DOMLoading
DNS TCP HTTP DOM DOM onLoad
解決 接続 Request/ 処理時間#1 処理時間#2 (通常の
処理 Response (同期) (非同期・並列) JS処理)
DNS解決: SPDY/SSL ともに同じだろう
TCP: SSL のハンドシェイクは同じだが、再利用前提のSPDYは効果が高い。
HTTPリクエスト・レスポンス: ヘッダ圧縮の分だけSPDYの効果が高い。Server
Push はここでコンテンツを送る。
DOM処理(同期):SPDY/SSLともに同じはずだが・・・ 。
DOM処理(非同期): イメージのダウンロードなどSPDY効果が一番現れるだ
ろう。
onLoad: JSの処理部分だから同じだろう。
- 14. node-spdyについて
• spdy v2/v3 対応。
• 開発者は Nodeコアの Fedor Indutny@voxser
• HEADERS、CREDENTIAL には未対応
• SETTING は、 MAX_CONCURRENT_STREAMS
と INITIAL_WINDOW_SIZE のみ対応
• node-v0.10 でも動作します。でも stream2 の
影響でバグがありそう。調査中。
- 15. Server Pushのフロー
/index.html
SYN_STREAM この間にサーバが
HTTPリクエスト
stream_id = 3 先読みさせるレスポ
ンスとデータをサー
SYN_STREAM バ側から送る
associated_stream = 3
unidirectional = true
/images/pic1.png
キャッシュ DATA Frame
クライアント
サーバー
SYN_STREAM
/images/pic2.png
キャッシュ DATA Frame
コンテンツがキャッ SYN_REPLY
シュされていれば新 HTTPレスポンス
しくリクエストしない。 DATA Frame