【WV.3】TTFBとページキャッシュ – Capital P

Web Core Vitalの第3回では、TTFBという概念およびそれを短くするためのページキャッシュを紹介する。TTFBはCore Web VitalのLCPに大きく関わる指標である。横文字ばかりで「なんのこっちゃ」という感じだろうが、要するに「HTMLが表示されるのが早いか」という項目である。

TTFB（Time To First Byte）とは？

TTFBは直訳すると「最初の1バイトまでの時間」である。これはブラウザがURLを叩いてから最初の応答を受け取るまでの時間だ。多くのWordPressサイトにおいて、「テーマの処理が全部終わってwp_footerの下まで行った」ということを意味する。

「多くの」と書いたのはなぜかというと、通常のWebサーバーではPHPの処理が終わるたびにHTMLを出力しているのではなく、出力バッファというものを利用して「ある程度出力すべきものが溜まったら出力」という仕様になっているからだ。

<?php
// example.com/hoge.phpにアクセスしたとき
ehco '1';
echo '2';
echo '3';
// 上の1行が毎回出力されるわけではない。

したがって、ほとんどの場合、WordPressの処理がすべて終わるまでがTTFBとなる。「ほとんどの場合」ではない例外については次回以降で共有する。

要求されるTTFBと実現性

TTFBは200ミリ秒以下、つまり0.2秒以下ならまあよいだろうということがGoogle Page Speed Insightsの指摘でわかる。だが、普通にWordPressサイトを利用している場合、素の状態で1秒を切ることはけっこう難しいだろう。「デフォルトテーマでコンテンツはテーマユニットテストのみ」という状況ならわからないでもないが、メニューやサイドバー、コンテンツの直後にモリモリと導線が張られるの常である。サイドバーのランキングなどなど、一ページに複数回のクエリが走ることも稀ではない。

WordPressの高速化と言われたときにすぐ思いつくのが「ページキャッシュ」である。これまでCapital Pでも紹介した通り、ページキャッシュを使えば0.2秒以下で表示することも難しくない。WP Super Cacheのようなプラグインを利用して、ページキャッシュを導入しよう。これで90%以上の時間が削減できるはずだ。

というより、常人がある程度コンテンツの豊富なWordPressを管理している場合、キャッシュなしで0.2秒を切るのはまず無理と思っておいた方が良い。

もしあなたが一般的なブロガーなどである場合は、ここまで行けばもう十分であり、これ以上なにかをする必要はない。以下はプロフェッショナル向けの情報を記載するので、興味がある場合だけご覧いただきたい。

プロフェッショナル向けの内容

ページキャッシュを導入すれば大抵の場合200ミリ秒以下、まずくても500ミリ秒以下にはなるはずだが、もしなんらかの事情でさらにカリカリのチューニングが必要になる場合は以下の点をチェックしてみてほしい。

DNSルックアップ
SSLではなくTLS
CDNキャッシュ

Advanced 1. DNSルックアップ

さて、TTFBにはDNSルックアップ、つまり「 capitalp.jp ってどこやねん」という判断を行うまでの時間がかかる。このDNSにも高速なもの、負荷分散されたものが存在する。

ドメインを購入した場合、DNSもついてくることが多いが、DNSサーバーの性能が高いとは限らない。たとえばAWS Route53やCloudFlareの提供するDNSは0.03秒以下であり、その他の遅いDNSでは0.1秒を超えるところもある。後者の場合、TTFBとして許容される0.2秒の半分がDNSルックアップに費やされることになるので、DNSサーバーは限りなく高速かつ世界中に分散されているものを選ぶのがよいだろう。AWS Route53はかなり高速だし、CloudFlareも同様。実はWordPress.comもけっこう早い。

Advanced 2. SSLハンドシェイク

現在のWebサイトの多くはSSLで運用されているはずだが、このSSLもSSLハンドシェイクといって、ブラウザに何かを表示する前に「このリクエストは正当なものか」をチェックするプロセスが存在する。

だいたいの場合は問題ないはずだが、SSLとTSLという2つのやり方が存在する。2019年以前に設定したサーバーではSSL 2.0〜3.0などの古い方式が有効になっているかもしれないが、これらは遅くて危険な上に、そもそもブラウザでサポートされなくなっているので、必ずTSL 1.3以降を利用するようにしよう。TSL1.2とTLS1.3でほとんどのブラウザがサポートできるはずだ。

Advance 3. CDNキャッシュ

やや上級者向けの使い方だが、予算が許すのであればCDNでページキャッシュを行おう。プラグインの多くはWebサーバーのレベルでキャッシュを行う。それでもかなり高速化はできるはずだが、CDNのレベルでキャッシュをすれば、ユーザーからもっとも近いサーバーでキャッシュを返すことができるので、TTFBをさらに短くできる。

AWSのClouFrontでキャッシュをすることは、多くのエンタープライズホスティングで行っている。DigitalCubeのShifter、WordPress.com、そして筆者の運営するKunoichi Hostingもそうだ。物理的な距離というのはインターネット通信においてバカにならないもので、CDNでHTMLを配信することによってTTFBはさらに下げることができる。

なんにせよ、TTFBを100ミリ秒以下にできたら、かなり優秀なWebサイトだといえるだろう。がんばれば20ミリ秒台ぐらいまで下げることはできるので、色々試してみて欲しい。