First Paint Time with HTTP/2 Server Push

benchmark.md

HTTP/2 Server Push に関する一考察 (続き)

このスライドで話したことの続き。レンダリングのパフォーマンスを計測するのに DOMContentLoaded は妥当ではない、という話があったので、First Paint による時間を計測する。First Paint については以下のページが詳しい。

• Webページ遷移時間のパフォーマンス「First Paint」を計測する方法

計測方法

Chrome の Console 上で以下を実行し、First Paint の時間を計測する。出力される値の単位は秒になる。 サーバーやブラウザといった計測環境はスライドに記載されている環境の通り。

window.chrome.loadTimes().firstPaintTime - window.chrome.loadTimes().startLoadTime

結果

DOMContentLoaded と傾向はそれほど大きく変わらないようだ。また、サーバープッシュを使えばレンダリングが速くなるわけではない、というところにも変化はない。

サーバー	プロトコル	サーバープッシュ	First Paint
H2O	HTTP/1.1	-	5.9723
H2O	HTTP/2	-	9.4773
H2O	HTTP/2	CSS	6.3579
H2O	HTTP/2	JavaScript	13.9929
H2O	HTTP/2	Above the Fold	17.4133
H2O	HTTP/2	CSS & JavaScript	8.5565
H2O	HTTP/2	CSS & JavaScript & Above the Fold	15.1736
nghttpx	HTTP/2	-	2.9650
nghttpx	HTTP/2	CSS	18.5551
nghttpx	HTTP/2	Above the Fold	3.4625