h2o on yohoushi

1. HTTP/2 でリバプロするだけ
でグラフツールを
高速化できた話
!
!
2015/04/14 @sonots
HTTP/2 RFC発行記念パーティ+LT大会

2. Copyright (C) 2014 DeNA Co.,Ltd. All Rights Reserved.
2
自己紹介
・瀬尾 @sonots
・DeNA, Co., Ltd
・Fluentd コミッタ
・最近、vim-plugin になり
ました
・HTTP/2 弱者
https://github.com/mattn/vim-sonots

4. Yohoushi
• 拙作の便利っぽいグラフツール

5. h2o
• あの nopan や unco で有名な
• :D 社の kazuho さんが作った
• 高速 HTTP サーバ
• HTTP/2 リバースプロキシとしても利用できる

6. h2o + Yohoushi

7. h2o
Yohoushi
Browser
HTTP/2
HTTP/1.1

8. HTTP/2 の特徴
• バイナリでの通信
• リクエストとレスポンスの多重化によるレイテン
シの削減
• ヘッダの圧縮によるプロトコルオーバーヘッドの最小化
• リクエスト優先度設定
• サーバープッシュ

9. HTTP/1.1
• 接続ごとに SYN/ACKの１往復 (keep-alive しない場合)
• リソースごとにリクエスト/レスポンスの１往復
• ブラウザは最大で４∼６並列
※ ハイパフォーマンスブラウザネットワーキングより

10. 多重化 ~ HTTP/2
• １つ接続内に複数の仮想チャンネル
• 100以上の同時リクエストが可能
※ ハイパフォーマンスブラウザネットワーキングより

11. サーバサイドで画像生成
している に
大量の画像データを
転送しておける可能性

12. Yohoushi (HTTP/1.1) 単独
Chrome
6並列

13. h2o on Yohoushi (HTTP/2)
>=
6並列

14. 600グラフ １回目 2回目 3回目
HTTP/1.1
(non keep-alive)
13.67s 14.12s 13.93s
HTTP/2 リバプロ 9.20s 9.46s 9.02s
600グラフ表示比較
1.5倍速！！！
Web Worker 数 4

15. web worker 数を6以上に
web worker 数
4 => 12
１回目 2回目 3回目
HTTP/1.1
(non keep-alive)
13.40s 13.24s 13.32s
HTTP/2 リバプロ 8.58s 8.14s 9.06s
コア数 4 のホスト、コア数あればもっと伸びる可能性大
1.55倍速！！！

16. varnish １回目 2回目 3回目
HTTP/1.1
(non keep-alive)
9.83s 8.91s 9.05
HTTP/2 リバプロ 6.01s 6.66s 5.90s
おまけ (キャッシュして静的配信)
キャッシュで HTTP/1.1、HTTP/2 共に 1.5倍速
動的配信: HTTP/2 で 4.6 sec 高速
静的配信: HTTP/2 で 3.3 sec 高速
VIRNISH_MIN_THREADS=500

17. HTTP/1.1 HTTP/2
latency が入る回数が少ない
理屈
サーバ処理
サーバ処理
サーバ処理
サーバが遊んでる時間がなくなる
リクエスト
レスポンス
ネットワーク
ネットワーク
ネットワーク

18. HTTP/2 でリバプロ
!
• リクエストとレスポンスの多重化によるレイテ
ンシの削減
• 社内ネットワーク (低レイテンシ)でも
• 1.5倍速！！！(当社比)
• Web Worker 数を６以上に増やして
• 1.55倍速！！！(当社比) コア数あればもっと速度出る可能性大