「レンダリングを妨げるリソースの除外」とは?Page Speed Insightsの原因と対策【超初級】

「レンダリングを妨げるリソースの除外」というのが出てきて解決方法に困ってませんか?レンダリング・リソースって何?という方にも一から説明します。これを読んだらPage Speed Insightsの表示速度評価が少し上がりますよ。

わたしのサイトではこのような判定になりました。2.74秒って…!

レンダリングとは?

レンダリングとはWeb関連用語の一つで「読み込んだ情報を表示する」というようなニュアンスです。英語でrenderingという綴りで「表現・演出」という意味をもちます。

「レンダリングを妨げるリソースの除外」ってどういうこと?

Page Speed Insightsで現れた「レンダリングを妨げるリソースの除外」とは「サイトの表示を重くするメモリ容量を除外する」ということです。サイト表示するまでに余分な情報が混ざっているということだったんですね。余分と言ったら変ですが、サイトのデザインなんかが表示を遅くしていることがしばしばです。

もう少し詳しく説明します。そもそもサイト表示をするためには、<head>タグの中身を読み込んでからサイト画面を表示するという仕組みになっています。
<head>タグの中身を軽くするか、<head>タグの中身の一部を遅らせて読み込むようにすれば「レンダリングを妨げるリソースの除外」の問題が解決するということです。

方法①WordPressプラグインをインストールする

最も簡単な方法です。根本的に何をすることで「レンダリングを妨げるリソースの除外」の対応策になるのかというと、CSSとJSの遅延読み込み(読み込みを遅らせること)です。CSSとかJSとか小難しそうなワードが出てきましたが、つまりはデザインの表示部分は表示を遅らせて最低限読めるだけの情報量だけ先に読み込ませよう、という意味合いです。

以下のWordPressプラグインを導入することによってこれは改善されます。

BJ Lazy Load

インストールするだけで機能するのでとても便利ですね。これ以外にも画像の遅延読み込みをしてくれるプラグインはあるのでこれ以外でも大丈夫です。

方法②不要なプラグインを削除する

単純ですが、使っていないプラグインが表示速度を遅くすることもあるので、あってもなくてもいい、というレベルのものであれば削除してしまいましょう。

「どのプラグインが絶対必要なの?」と思う方に、最低限必要なものだけをピックアップします。追加するとしたら操作をしやすくするためのものなので、どうしても使うというのであれば入れたままでもいいでしょう。

  • Akismet Anti-Spam (アンチスパム)
  • All In One SEO Pack
  • BackWPup
  • BJ Lazy Load
  • Google XML Sitemaps
  • Imsanity
  • WP Fastest Cache

わたしはこれ以外にGutenbergを入れているんですが、これはブログを書く時にテキスト入力を楽にするツールなので入れています。

まとめ

  • 簡単に表示速度を改善したいなら遅延読み込みのプラグインを導入
  • プラグインを入れすぎてないか一度精査して取捨選択する

表示速度を遅くするのは大抵画像やデザインの読み込みが原因なので、画像の遅延読み込みはマストでしても良いでしょう。そのほかCSSやJSに関しては専門知識が若干必要になるので最初はしなくて大丈夫です。

また、元々このようなプラグインの機能が最初からついているWordPressテーマもあるのでこちらも検討してみてください。

表示速度抜群!WordPress有料テーマTHE THOR(ザ・トール)
4

サイトの表示速度が早くSEO対策になる!
9種類の着せ替え機能があり、デザインの幅広さが特徴のザ・トール。

ブログの個性を出したい、本格的にブログ運営をしたい方におすすめのWordPress有料テーマです。

レンダリングを妨げるリソースの除外って何?手軽な改善方法
最新情報をチェックしよう!