自分のサイトのパフォーマンスはSEOにもつながるので気になりますよね。
Googleが提供している”PageSpeed Insights”でページ速度の計測を行っている人も多いと思います。
無料で的確な分析を行ってくれるのでありがたいツールですが、的確なため、難しい用語がどんどん出てきます。
今回の「レンタリングを妨げるリソースの除外」の項目の改善は、
ページに影響しない要素をインライン要素化することで解決できるとのアドバイスが表示されましたが、
影響しない要素を探し出すことを面倒に感じてしまったので、プラグインに頼ることにしました。
今回使用するプラグインは、“Autoptimize”です。
Autoptimizeの設定
以下の画像とキャプションをご参考にどうぞ。
![](https://i0.wp.com/muralnotes.com/wp-content/uploads/2019/10/sidemenu.png?resize=394%2C205&ssl=1)
![](https://i0.wp.com/muralnotes.com/wp-content/uploads/2019/10/install.png?resize=438%2C264&ssl=1)
![](https://i0.wp.com/muralnotes.com/wp-content/uploads/2019/10/bar.png?resize=157%2C39&ssl=1)
![](https://i0.wp.com/muralnotes.com/wp-content/uploads/2019/10/Screenshot_2019-10-20-Autoptimize-設定-‹-murals-Notes-—-WordPress.png?resize=582%2C241&ssl=1)
![](https://i0.wp.com/muralnotes.com/wp-content/uploads/2019/10/css-option.png?resize=582%2C256&ssl=1)
![](https://i0.wp.com/muralnotes.com/wp-content/uploads/2019/10/Screenshot_2019-10-20-Autoptimize-設定-‹-murals-Notes-—-WordPress2.png?resize=582%2C92&ssl=1)
![](https://i0.wp.com/muralnotes.com/wp-content/uploads/2019/10/Screenshot_2019-10-20-Autoptimize-設定-‹-murals-Notes-—-WordPress3.png?resize=582%2C143&ssl=1)
Pagespeed Insightsの結果比較
早速、Autoptimizeの有無でのスコア比較を行いました。
まずはモバイル。設定前は…
![](https://i0.wp.com/muralnotes.com/wp-content/uploads/2019/10/mobile-before.png?resize=760%2C275&ssl=1)
“61”と改善の余地が在りそうなスコアでした。
Autoptimize設定後…
![](https://i0.wp.com/muralnotes.com/wp-content/uploads/2019/10/results.png?resize=760%2C275&ssl=1)
“84”!スコアが”21“も上昇しました。
パソコンでのスコアも確認しました。
設定前…
![](https://i0.wp.com/muralnotes.com/wp-content/uploads/2019/10/pc-before.png?resize=760%2C275&ssl=1)
設定後…
![](https://i0.wp.com/muralnotes.com/wp-content/uploads/2019/10/pc-result.png?resize=760%2C275&ssl=1)
スコアのゲージが緑になりました。
これで一安心。
また、編集画面での「下書きとして保存」が完了までに8秒近く掛かっていたのが
2秒弱まで早まりました。これはうれしい誤算です。
まとめ
無事、導入できましたでしょうか。
難しい設定もほとんどないのに簡単にスコアを改善できて、本当に便利だと実感しました。
上記の通り、SEO目的以外にも動作が軽くなった箇所もあり、ありがたかったです。
最後までお読みくださりありがとうございました。
ご不明点などあればコメント欄までお寄せください。
コメント