WordPress苦手主婦のためのWordPress専門コミュニティ「MasterPress®︎」詳細はこちら

「使用していないJavaScriptの削減」の改善方法!Flying Scriptsでサイトスピードが激変

読者さん

PageSpeed Insightsのスコアを確認したら、モバイルのスコアが遅すぎてビックリしました。
「使用していない JavaScript の削減」という項目を改善するようにと表示されているのですが、どのように改善したらいいのでしょうか?

このような疑問を解決します!!

PageSpeed Insightsでサイトスピードを確認すると、パソコンは遅くないけど、モバイルがものすごく遅い、なんて方が多くいらっしゃいます。

その大きな原因としては「使用していない JavaScript の削減」が問題だったりします。

ただ、この「使用していないJavaScriptの削除」は「Flying Scripts」というプラグインで簡単に解決できます!!

この記事は、PageSpeed Insightsで「使用していない JavaScript の削減」が原因でサイトスピードのスコアが悪い方向けに「Flying Scripts」のプラグインのインストールから使い方を解説します!!

PageSpeed Insightsの「使用していないJavaScriptの削減」の改善方法

「使用していないJavaScriptの削減」は、サイトを表示させるときに動く必要がないプログラムの読み込みを制御して、ネットワーク通信量を減らすことです。

最近は、サイトスピードをGoogleが重視するので、PageSpeed Insightsでスピードをチェックする方が増えています。

その中でも、サイトスピードが遅い大きな原因は「使用していないJavaScriptの削減」です。

「使用していない JavaScript の削減」の改善策としては、ワードプレスプラグインの「Flying Scripts」を導入することで解決できます。

ワードプレステーマによっては、テーマの機能でスクリプトの遅延読み込みがあります。
その場合は、プラグインは導入しなくて大丈夫です。

ちなみに、ワードプレステーマ「SWELL」は、スクリプトの遅延読み込みで解決できます。

参考:SWELL公式サイト:「スクリプトの遅延読み込み」機能の使い方について

WordPressプラグイン「Flying Scripts」とは?

「Flying Scripts」のプラグインは、特定のJavaScriptを読み飛ばすことができるプラグインです。

JavaScriptとは、WEBページ上で高度なことを実現できるプログラミング言語です。

例えば、「スライドショーのスクロール」「マウスを合わせると変化するボタン」などは、JavaScriptのプログラムで動いております。

JavaScriptは、ワードプレスにとってはとっても大事なプログラムなんですが、非常に大量のリソースを消費します。

なので、WEBサイトを表示させるときに動く必要がないのに動いてしまっているJavaScriptは、制御をしてあげることで、サイト表示を早めることができるのです。

そこで、JavaScriptを読み飛ばせる「Flying Scripts」のプラグインを導入して、読み込みスピードの改善を行います。

「Flying Scripts」を導入すると、画面表示が壊れてしまうことがありますので注意しましょう!
作業をする際は、バックアップを取るのを忘れずに!!

WordPress専門のコミュニティ
「MasterPress」の主宰をしています!

Flying Scriptsのインストール方法

それでは、ここからFlying Scriptsのインストール方法をまとめていきます。

まずワードプレスのダッシュボードから、「プラグイン」→「新規追加」をクリックしてください。

プラグインの追加画面が開くので、右の検索窓に「Flying Scripts」と入力し、以下の画像のプラグインを「インストール」して「有効化」します。

これでインストールが完了です。

Flying Scriptsの設定

Flying Scriptsのプラグインを有効化したら、その後に設定を行いますので、右のメニューの「設定」→「Flying Scripts」をクリックします。

「Flying Scripts」の設定が開いたら、Include Keywordsに遅延させたいJavaScriptを指定して、Timeoutには遅らせる時間(推奨は5s)を設定します。

Include Keywordsに指定するJavaScriptは、PageSpeed Insights の改善に表示されているものを指定すると効果的です。

※上記を見ると分かるのですが、このJavaScriptが一体なんなのか分かりづらいです。

ですので、良くあるJavaScriptの一部をご紹介します。

ツイッターの埋め込み・いいねボタンtwitter.com/widgets.js
インスタの埋め込みinstagram.com/embed.js
フェイスブックの埋め込み・フォローボタンconnect.facebook.net
ピンタレストの埋め込み・ピンボタンassets.pinterest.com
Googleアドセンスadsbygoogle.js
Googleアナリティクスgoogletagmanager.com/gtag/js
gtag(
Googleタグマネージャーgtm.js

など・・・

このような感じで、JavaScriptをInclude Keywordsに入力できたら、必ず「Save Changes」をクリックして保存しておいてください。

これで、Flying Scriptsの導入から設定までが完了しました。

このプラグインの設定が終わったら、「キャッシュをクリア」して、PageSpeed Insightsのサイトで再度スコアを確認してみてください。

おそらく、サイトスピードが改善されているかと思います。

まとめ

今回は、PageSpeed Insightsで「使用していない JavaScript の削減」が原因でサイトスピードのスコアが悪い方向けに改善方法をお伝えしました。

PageSpeed Insightsで「使用していない JavaScript の削減」を改善するには、「Flying Scripts」のプラグインを使用することです。

「Flying Scripts」を導入して、少しでもサイトスピードを早くしGoogleにいい評価をしてもらってくださいね♪

WordPress専門のコミュニティ
「MasterPress」の主宰をしています!


WordPressの基本から大事なポイントなど、分かりやすく丁寧に配信中!

メルマガでは、これからWordPressブログを始めたいと思っているパソコン苦手な主婦のために、ワードプレスブログの作り方をお届けしています。
メルマガの登録は無料!配信解除はいつでもOK! 登録はこちら↓


ABOUT US
ゆかアフィリエイター兼WordPress専門家
ご訪問ありがとうございます! ゆかブログの管理人でアフィリエイター兼WordPress専門家のゆかです。福岡で3人の子供を育てながら、お家でのんびりとブログを書いて生活しています。
ブログを書く以外のお仕事は、パソコンが苦手な女性起業家さんのワードプレスブログ運営をサポートしたり、代行でワードプレスの立ち上げをしています。 ●WordPressコミュニティ『MasterPress』運営
●福岡副業カレッジブログ講師
SEO検定3級
●チャンネル登録1万人超え!WordPressブログ構築専門YouTubeチャンネル「ゆかチャンネル

ゆかブログでは、WordPress作成方法・ブログ記事の書き方・アフィリエイトの方法など、パソコン苦手な初心者さんの『困った!!』を解決しています。
詳しいプロフィールはこちら>>