--- title: PageSpeed InsightsでドキュメントTTFBはSpeedIndexにしか影響しない tags: PageSpeedInsights author: miyanaga slide: false --- PageSpeedスコアを調べる中で、ドキュメントTTFBとスコアの関係に疑問がありました。 ドキュメントTTFBが遅いとその後のプロセスがすべて一様に遅れるので、最もスコアへの相関性が高いはずと思いきや、そうはなりませんでした。 > PageSpeed Insightsの改善にはまずJavaScriptのダイエットを > https://qiita.com/miyanaga/items/b3d955a6fd70ef7d89ec # 2020/6/3 追記 本家レポートより**PageSpeed Insightsのスコア改善が捗る裏レポートツール**を公開しました。合わせてご参考ください。 https://simulate.site/cheatspeed-insights/ # 検証 シンプルなHTMLを出力するPHPを用意し、`wait`パラメータの分`sleep`させてドキュメントTTFBを偽装します。 ```php:index.php TTFB Test

PageSpeedスコアとドキュメントTTFBのテスト

``` ## TTFB≒0秒の場合 `wait`パラメータに0を指定した場合です。予想通りというか当然100点になります。 ![PageSpeed_Insights.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35178/a38b18d4-3527-4f2a-85bf-8a2786ea7e7d.png) `ラボデータ`の各タイミングが`0.7秒=700ms`というのは謎ですが… ## TTFB≒3秒の場合 `wait`パラメータに3を指定します。 ![PageSpeed_Insights.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35178/e07204ce-6aae-c733-86d1-1ac69781f82d.png) スコアが91に下がりましたが、ラボデータは`速度インデックス(SpeedIndex)`しか変化していません(TTIの0.8秒は誤差ということにします…)。 延長したTTFBは3秒ですが、`速度インデックス`は4.8-0.7=4.1秒伸びています。 ※ 速度インデックスの単位が秒というのはちょっと変なんですが、ここではスルーします。 ## TTFB≒5秒の場合 `wait`パラメータに5を指定します。 ![PageSpeed_Insights.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35178/c77e4bff-b337-801a-0623-07f2fe09394f.png) スコアは80に下がりましたが、こちらもラボデータは`速度インデックス`のみが長くなりました。また同じくTTFB5秒延長に対し、7.4-0.7=6.7秒伸びています。 以上の結果から、次のことが確認できました。 * ドキュメントTTFBが遅くなっても`SpeedIndex`しか遅延しない * `SpeedIndex`以外の指標はドキュメントTTFB以後のタイミングを起点に計測される # SpeedIndexにしか影響しないのでスコアとの相関は低い 総合スコアは、コンテンツの初回ペイント`FCP`、意味のあるコンテンツの初回ペイント`FMP`、速度インデックス`SpeedIndex`、CPUの初回アイドル`FID`、インタラクティブになるまでの時間`TTI`を元に計算されます。 > PageSpeed Insightsの点数はどのように計算されているか。100点をとるための条件 https://qiita.com/miyanaga/items/d38124cdd64a1999fed9 `SpeedIndex`の総合スコアに対する影響力は`4/15`です。仮に`SpeedIndex`が0点評価でもほかが100点なら73点を獲得できます。 # Chrome DeveloperツールのAuditsタブはまた挙動が異なる Auditsタブで、TTFB≒5(wait=5)を試してみたところ、次の結果になりました。 DevTools_-_dummy_ttfb-test_rehearsal_lightfile_net_index_php_wait_5.png FCP、FMPなどのタイミングが軒並み5秒強となっています。当初予想した**「TTFBが遅れるとその後の処理が一様に遅れる」**状態です。 全体の指標が伸びてしまったのでスコアも大きく悪化しています。 ちなみに`npm`版の`Lighthouse`を単体で試したところ、前述の`PageSpeed Insights`と同じく`SpeedIndex`にしか影響しませんでした。 ChromeのAuditタブは実はLighthouseと違うという新たな謎を残してしまいました…