HTTP/2になっているか確かめる ~自宅のChromeがHTTP/2になっていなかった件と対処法について 

この記事は約4分で読めます。

2017-03-23IT雑記, KUSANAGI for ConoHa

この度、SpeedInsightsの見かけ上の数字だけでなく抜本的にチューニングすることとしました。
というのもhttp/2の仕様なるものをようやく知ったから。
常時SSL化とhttp/2で速くなるくらいは知っていたのですが、どういうものが理解してなかったんですよね。
私の環境KUSANAGIはデフォルトでHTTP2に対応している、それなのに何やってるのかという感じです。

HTTP/2とは?

Cloudflareのブログからです。

HTTP/2
引用:https://blog.cloudflare.com/introducing-http2/

ざっくり言うと、

http 1.1:1回で1つのファイルのみやりとりできる。
http/2:1回で複数のファイルのやりとりできる。

……ということは。

質問者の写真

cssの結合とか無駄じゃん!
 

今まですべきとしていたjs、cssの結合はメリットない。
インライン化もメリットない。
キャッシュしなくなるから、むしろデメリットにすらなる。

理屈上はそういうことですよね?
そう思って調べてみたら、やはり書いてました。

HTTP/2においては、HTTP/1.1時代に用いられていた対策のうち、不要となるばかりか、むしろ逆効果になるものがあります。代表的なものは以下の通りです。

  • ドメイン・シャーディングによるコネクションの複数化
  • 必要以上のリソースの結合
    • CSS、JavaScriptの結合
    • 画像のスプライト
  • Base64形式へのエンコード

ですよね(;´Д`)

引用元はこちら、記事の内容すごかったです。

HTTP/2になってない!

というわけで、今までのセッティングを全て見直すことにしました。

その前に一応HTTP/2になっているか確認しておこう。
KUSANAGIは常時SSL化すればデフォルトでHTTP/2のはず。
そこでChromeの拡張プラグイン「HTTP/2 and SPDY indicator」を入れてみました。

同プラグインを入れると、開いたページがHTTP/2に対応している場合、アイコンが青くなります。

こんな風に。
しかしなぜかグレーのまま!

なぜ? どうして?
Chromeの検証画面で確かめてみる。
方法は下図の通り。

……h2が見当たらない(※この画像は対策終わった後です、念のため)

原因を考える

さすがにKUSANAGIがおかしいってことはあるまい。
それならもっと声が上がってる。
間違いなくおかしいのは自分です。

こういうときは大抵セキュリティソフトが悪さをしている。
私が使っているのはESET。
検索してみると……そもそも、私の使っているESETが2年前のverであることに気づく。
先にESETをバージョンアップしよう。

最新版にバージョンアップ終了。
この時点で無事HTTP/2 and SPDY indicatorのアイコンが青く点灯。
案外呆気なく解決しました。

HTTP/2が適用された結果

さて速度計測。
GTmetrixは、これまでトップページが最短1.9秒くらいでした。
それもCloudflare使って。

質問者の写真

速い! めちゃ速い!
 

びっくりしました。
KUSANAGI、ここまで速かったんだ……。
さて、トップページ以外も頑張ろう。

まとめ

解答者の写真
セキュリティソフトとの相性は要チェック。
不安になった方は念のため確認してみて。