WordPressはどうしても遅くなるというイメージがありますよね。便利な反面、プラグインを多用するとどうしてもページの表示速度が低下してしまいます。
ページの表示速度が遅くなるだけで、ユーザーの離脱率に影響を与えるので表示速度は速いに越したことはありません。
また、Googleが来年以降、core web vitalのスコアを加味して検索結果を表示させるといっています。そのため、core web vitalのスコアは気にしないといけなくなりそうです。
今回はgzip圧縮について解説していきます。
gzip圧縮とは
ファイルサイズを圧縮する手段のうちの一つです。この設定を入れることで、ユーザーがサーバーと通信する際に圧縮したファイルをやりとりすることができ、通信容量を圧縮することができます。その結果として、ページの表示速度を早くすることができます。
NginXの設定
コンテンツの圧縮を行なっていなかったので、そちらの設定を追加。
nginxのconfファイルに下記を追加するだけです。
gzip on;
gzip_types text/css application/javascript application/json application/font-woff application/font-tff image/gif image/png image/jpeg application/octet-stream;1行目のgzip on;こちらでgzip圧縮が有効になります。
2行目のgzip_typesこちらで、gzip圧縮するコンテントタイプを指定していきます。上記の例では、cssや画像といった静的ファイルを基本的に設定してあります。
nginxを使っている方は、この設定がもし入っていなければ入れるだけで、通信量の圧縮をすることができます。
gzip圧縮されているか確認する方法
webサイトがgzip圧縮できているかどうかは、response headerを見ることで確認することができます。
response headerに下記が入っていればgzip圧縮できています。
content-encoding: gzipこちらの確認方法は、google developer toolから確認することができます。
Response Headerの確認方法
Networkタブ -> 確認したいコンテンツを選択 -> 右側にheader情報が表示されるので、そこでresponse headerを確認することができます。
