JavaScript 削減 Flying Scripts プラグインで解決【WP自習部屋】

前回「Lighthouse」と言うサイトの診断ツールを紹介しましたが、診断した結果「自身のサイトの修繕・変更点」が見えてきたと思います。

個々のサイトも高得点に向けて色々対策を探していて「役立つんじゃない」と見つけたプラグインを紹介したいと思います。

サイト診断で多い「未使用のJavaScriptを減らす」

サイト診断で多いのが「未使用のJavaScriptを減らす」と言う項目。

解決策を探ろうと色々探すも「CSSを・・・」など素人同然の私には「やばそう」と思う事しか見つかりません。

ぴよ

プラグインってないのかな？？

そう思って探してみると・・・あるじゃないですか！

使用していないJavaScriptをいちいち読み込ませないようにできるプラグイン。

それが「Flying Scripts by WP Speed Matters」

はっけん！

https://white-grampus.xyz/lighthouse-google-chrome/

white-grampus.xyz

Flying Scripts by WP Speed Matters　インストール

Flying Scripts

Download and execute JavaScript on user interaction.

ja.wordpress.org

管理画面から「プラグイン」➡「新規追加」

検索画面に「　Flying Scripts　」と打ち込みま確認し「インストール」➡「有効化」

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

cocoon「初心者にもおすすめ記事作成時の装飾」旧エディタ スタイル編

WPテーマの「cocoon（コクーン）」を使用しはじめて「色々出来るな～！」と今までしていなかった文字の装飾や…

www.white-grampus.xyz

Flying Scripts by WP Speed Matters 設定

Flying Scripts by WP Speed Mattersの設定と言っても何もしなくていいです。

Flying Scripts by WP Speed Matters 使用方法

Flying Scripts by WP Speed Mattersの使用方法を説明します。

管理画面から「設定」➡「Flying Scripts」をクリックします。

別タブでLighthouseで診断し「使用していない JavaScript の削減」の部分をクリックすると詳細が表示されます。

表示されている「使用していない JavaScript」のURLをコピーして

Flying Scripts by WP Speed Mattersの「Include Keywords」の部分に貼り付けます。

次を貼り付けるときは段落にして「使用していない JavaScript」のURLすべて貼り付けます。

おわったら「save change（設定保存）」をクリックします。

これで作業は終了です。

もう一度別タグ（別のページ）でサイトを表示し診断すると「使用していない JavaScript の削減」が消えて居たり少なくなっている事で「パフォーマンス」の点数がぐんと上がっている状況になってていました。

これでサイトの状態は良い方向に進んだと言う事になります。

これは一例ですべてのサイトが上がると言う事ではありませんが、良い状態に進む一つとして紹介してみました。

これですべてよくなったと言う事ではありませんが、少しずつ改良していいサイトを目指したいと思います。