商品画像を待っています

Asset CleanUp Pro

商品コード: asset-cleanup-pro カテゴリー:

Asset CleanUp Proはページの読み込みを高速化するためのプラグインです。

Webページのソースコード内にあるCSSやJavaScriptを解析し、必要ないファイルを読み込まないようにしたり、読み込みを遅延させることによって表示を高速化させます。

プラグイン、スクリプト、スタイルシートの読み込み最適化

読み込まれるプラグインやCSS/JSファイルの中には、不必要なものや特定のページでだけ必要なファイルが存在します。

Asset CleanUp Proを使う事で、特定のページやサイト全体で読み込まれるファイルを最適化する事が可能です。

JavaScriptファイルの読み込むタイミングを最適化

Asset ClenUp Proを使う事で、 ページ内で読み込むJavaScriptファイルに対し、deferやasyncなどの属性を適用することができます。

これらの属性を追加されたJavaScriptは、必要になるタイミングまで読み込まれることはありません。

そのため、他の必要なコードを優先的に読み込む事が可能になり、ページの表示速度を高速化することに繋がります。

CSS/JSファイルの読み込むタイミングを最適化

Asset CleanUp Proを使用することで、CSS/JSファイルが読み込まれる場所を変更する事ができます。

読み込み場所を変更することで、CSS/JSファイルの読み込みに時間がかかることで発生するレンダリングブロックを防ぐ事ができます。

もしくは読み込みに時間のかかるファイルを先に読み込ませておく、といった使い方も可能です。

ハードコードされているCSS/JSファイルの読み込みを防ぐ

Asset CleanUp Proを使う事で、ソースコードに直接記載されているCSS/JSファイルをwp_enqueue_scripts() などの関数を介して複数回読みこんでしまうことを防ぐ事ができます。

冗長な読み込みを防ぐことによってWebページの表示速度の改善に繋がります。

Asset CleanUp ProはCSSやJavaScriptの読み込みを最適化することで、ページ読み込み速度の高速化をはかるプラグインです。

使用することで、ユーザーエクスペリエンスが向上し、検索順位の向上が見込めるでしょう。

Asset CleanUp Proの使い方

基本設定

ここでは、Asset CleanUp Proを使用するための基本設定について説明します。

  1. 　WordPressダッシュボードの[Asset CleanUp Pro] の中にある[設定] をクリックします。
  2. [プラグインの使用設定]タブ の中にある[アセットリストから WordPress コアファイルを非表示にする] のトグルスイッチを操作します。
    有効化することで、jquery、wp-embed、comment-reply、dashicons等のファイル読み込みを管理することが可能になります。
  3. [テストモード] タブにある[テストモードを有効化] のトグルスイッチを操作する。
    有効化することで、Asset CleanUp Proの設定中は訪問者に対してファイル読み込み設定を反映しない状態にする事ができます。
    読み込まなければいけないファイルを無効化してしまった場合でも、テストモードを解除するまで訪問者には影響がありません。

以上で作業は終了です。

サイト全体で読み込まないファイルの設定

ここでは、サイト全体で読み込まないファイルの設定方法について説明します。

  1. WordPressダッシュボードの[Asset CleanUp Pro] 内にある[設定] の中から、[サイト全体でアンロードする] タブをクリックしてください。
  2. [絵文字をサイト全体で無効化する] のトグルスイッチを操作します。
    サイト全体で絵文字を使用していない場合、有効化することで関連するファイルを読み込まないように設定できます。
  3. [oEmbed(Embeds)をサイト全体で無効にする] のトグルスイッチを操作します。
    ブログカードなどの外部サイトの埋め込み機能を使用していない場合、有効化する事で関連するファイルを読み込まないように設定できます。
  4. [ツールバーが非表示の場合にDashiconsを無効にする (サイト全体)]  のトグルスイッチを操作します。
    WordPressログイン時、上部にアイコンが表示されていますが、非ログイン時にも読み込まれている可能性があります。有効化する事で、関連するファイルの読み込まないように設定できます。
  5. [Gutenberg CSS Block Libraryをサイト全体で無効にする] のトグルスイッチを操作します。
    Gutenbergブロックを使用していない場合、有効化する事で関連するファイルを読み込まないように設定できます。
  6. [Comment Replyをサイト全体で無効にする] のトグルスイッチを操作します。
    コメント機能を使用していない場合、有効化する事で関連するファイルを読み込まないように設定できます。

以上で作業は終了です。

各ページでCSSとJavaScriptを読み込まないようにする設定

ここでは、各ページでCSSとJavaScriptを読み込まないようにする方法を説明します。

  1. WordPressダッシュボードの[Asset CleanUp Pro] の中にある[CSS/JSマネージャー] をクリックします。
  2. 設定したいページに移動します。ここでは、ホームページで読み込まれるCSS/JSファイルの中から選択したものを読み込まないように設定します。
    [ホームページ] タグをクリックします。
  3. ページをスクロールすると読み込まれているCSS/JSファイルの一覧が表示されています。
    読み込まないようにしたいCSSファイルもしくはJavaScriptファイルを選択し、[このページでアンロード] を有効化します。
  4. また、一部のページでのみファイルを読み込みたい場合は、[サイト全体でアンロード] にチェックを入れ、アンロードルールの例外枠にある[URL (そのURI) が正規表現と一致する場合] にもチェックを入れ、該当するページの正規表現ルールを追加する事で設定できます。

以上で作業は終了です。

プラグインの読み込みの制御

ここでは、プラグインの読み込みを最適化する方法を説明します。

  1. WordPressダッシュボードから、[Asset CleanUP Pro] の中にある[プラグインマネージャー] をクリックします。
  2. タブの中から、読み込みを最適化したいページを選択します。
  3. 表示されたプラグインの中から読み込みたくないプラグインにチェックを入れ、[変更を適用する] をクリックします。

以上で作業は完了です。