次になったときのために記録しておきます。
現在、PageSpeed Insightsでの点数？はモバイルが63/100で、パソコンが73/100となっている。何点以上で問題がない状態になるのかわからないので、最初の目標として90点以上を目指します。
この記事は、PageSpeed Insightsのパフォーマンス改善のためにやったことを記録しています。この記事以外にも下記の記事で改善方法を記録しています。
WordPress 画像を圧縮 ページの読み込み時間のパフォーマンスを改善2
WordPress 圧縮を有効にする ページの読み込み時間のパフォーマンスを改善3
WordPress レンダリングブロック ページの読み込み時間のパフォーマンスを改善4
提案の概要
PageSpeed Insightsに提案の概要というのがあって、「ここがよくないですよー」というのが出ているのでそれを見ながら改善していきます。モバイルで、赤い！マークが2つに、黄色い！マークが2つ、
パソコンで、赤い！マークが1つに、黄色い！マークが3つあるので、記載しておきます。
- スクロールせずに見えるコンテンツのレンダリングブロック JavaScript/CSSの排除
- ブラウザのキャッシュを活用する
- 画像を最適化する
- 圧縮を有効にする
どうなるかわからないですが、わかりそうなところから取り掛かろうと思います。
途中経過など余裕があれば書いていきます。
ブラウザのキャッシュを活用する
PageSpeed Insights 提案の概要によると、静的リソースの HTTP ヘッダー内で、有効期日や最大経過時間を設定すると、ブラウザがネットワークからではなくローカル ディスクから以前にダウンロードしたリソースを読み込むようになります。
ということで、解決策として
https://developers.google.com/speed/docs/insights/LeverageBrowserCachingを見たのですが、さっぱりわからなかったので、ぐぐったところ「.htaccess」にキャッシュを残す期間の設定を書き込むといいということだったので、imageとtextのキャッシュ期間を書き込みました。
.htaccessは元はない場合があるらしく、ない場合は自分で作らないといけないようです。
今回.htaccessが見つけられなかったので、レンタルサーバーにあった、「.htaccessの編集」から追加しました。
この時点で、モバイルが67/100、パソコンが77/100にそれぞれ4点アップしました。
スポンサーリンク
