WordPress製品
Joomla 製品
サポート
ニュース
ログインWordPress でリソースをグループ化して縮小する方法
可能な限りパフォーマンスを向上させることは、Web サイトを管理し、WordPress でリソースをグループ化し、縮小するすべての人の夢であり、そのために私たちができる最善のことの 1 つですが、それは非常に難しいことかもしれません。 すべてのリソース (主に css ファイルと js ファイル) をグループ化すると、開発者でない場合、競合が発生する可能性があるため、Web サイトが公開される可能性があります。
WP Speed of Lightは、WordPress サイトを実行するための最良のソリューションです。これには、非常に使いやすいダッシュボードでサイトの読み込みを高速化するためのオプションが多数あり、そのオプションの 1 つがリソースのグループ化と縮小です。 グループおよび縮小プロセスからの単一ファイルの包含/除外は、競合せずにカスタム最適化を行うための鍵となります。
このブログ投稿ではワードプレスサイトの例を使用します。これを行う方法を学習し、すべてを構成するプロセスがより簡単になるようにします。
WordPress JSとCSSを縮小する方法
ワードプレスのjsとCSSの縮小を行う方法を学びましょうが、最初に、縮小の意味を知る必要があります。フォーマット、未使用のコードの削除、短い変数名と関数名の使用など」
次に、変更を確認するためにページの速度テストを行います。この例では、woocommerceといくつかの製品を含むサイトを使用しているため、初めての読み込みは少し遅くなります。
はい、ページの読み込みに 2.79 秒かかります。悪くはありませんが、もっと良い可能性があります。js と CSS を縮小して違いを確認しましょう。WP WP Speed of light > SpeedUp > Group & Minify、次のことが可能になります。をクリックして、縮小するすべてのオプションを含むメニューを表示します。 プラグインの無料バージョンにはグループと縮小オプションが含まれていますが、ビジュアル ファイルの除外は PRO アドオン バージョンでのみ利用可能です。
PROアドオンオプションは次のとおりです。インラインスクリプトを除外する（インラインスクリプトを縮小から除外する）、スクリプトをフッターに移動する（すべての縮小スクリプトをフッターに移動することでサイトを高速化できます）、グループフォントとGoogleフォント（グループローカルフォントとGoogleフォント単一のファイルでより速く提供されます）および高度なファイルの除外。
ご覧のとおり、JS、CSS、およびHTMLを縮小するオプションがあります。これらのオプションをアクティブにして、[保存]をクリックすると、すべてのリソースがすぐに縮小されます。高度な構成であるため、問題が発生する可能性がありますが、すべて一部のコードとファイルを除外して修正できます（プロアドオンを使用）。
これで、数時間かかる可能性のあるすべての開発者の作業が数秒で完了します。
次のステップ、WordPressがCSSとJSを最適化する
このプラグインを使用すると、ダッシュボードでグループ オプションを有効にするだけで、WordPress が CSS と JS を最適化できるようになります。 WP Speed of Light > SpeedUp > Group & Minify、グループ化するオプションを含むダッシュボードが表示されます。 CSSとjs。
これらのオプションを使用すると、次のことができます。
- グループJS：複数のJavaScriptファイルを1つのファイルにグループ化すると、HTTPリクエスト数が最小限になります
- CSSのグループ化：複数のCSSファイルを1つのファイルにグループ化すると、HTTPリクエスト数が最小限になります。
HTTPリクエスト：これは、何かを選択するか、同じサイトの別のページに移動するたびにサーバーに対して行われるリクエストであるため、これらのリクエストを減らすことができれば、ロード時間が短縮されます。
Web サイト上でグループ化できるファイルやスクリプトの量を確認するには、ブラウザ コンソールを開き (右クリック > [検査] または F12)、ネットワーク パネル。
次に、タイプ別にロードされたすべてのファイルを一覧表示できます。この例では、JSファイルリストのみをクリックしています。
これでこの設定が完了したので、グループオプション（Group CSSとGroup JS）を有効にして[保存]をクリックします。これらのオプションは慎重に使用する必要があり、競合を引き起こす可能性があるため、ページをテストする必要があることに注意してください。 。
真剣に取り組み、フォントの太さを最適化しましょう
何？ 他の最適化? はい！ フォントのウェイトを最適化できるようになります。設定でオプションを有効にするのと同じくらい簡単です。WP WP Speed of Light > SpeedUp > Group & Minify > Group fonts and Google Fontsオプションに移動するだけです。
グループ フォントと Google フォント オプションを使用すると、フォントを 1 つのファイルにグループ化して、より速く提供できるようになります。ほとんどの WordPress テーマとレイアウトには、デフォルトですべてのフォント (標準、太字、斜体) が 2 つまたはフォントが付属しているため、これは非常に便利です...)
そのオプションを有効にして保存をクリックすると、すべてのフォントがグループ化されます。
リソースを最小化およびグループ化するためのすべてのオプションをアクティブ化したので、サイトの読み込み時間に違いが見られるはずです。速度を確認してみましょう。
なんと、2.8秒から0.56秒へ！ この投稿の冒頭でお伝えしたように、ロード時間を改善することができます ;)
ファイル縮小除外の使用方法
縮小はサイトに問題を引き起こす可能性があります。これは主に、構文エラーや類似の変数、クラス名にエラーを含む特定のファイルをグループ化した場合に発生します。 そのため、「ファイル縮小除外」オプションを使用すると、縮小およびグループ化プロセスからファイルを除外できます。WP WP Speed of Light > SpeedUp > Group & Minify高度なファイル除外が表示されます。
高度なファイル除外を使用するには、最初にスキャンを実行してオプションを有効にし、[スキャンの実行]をクリックする必要があります。
Web サイトにロードされているスクリプトをリストできるようにするには、 WP Speed of Lightフォルダーをスキャンしてリストする必要があります。 通常、これらはすべて、すべてのプラグインとテーマをグループ化する /wp-content フォルダーに含まれています。 （少なくとも）そのフォルダーを選択し、 「今すぐスキャン」
スキャンが実行され、スキャンが完了したら、最後に結果の表示をクリックします。
タイプ (すべて、JS、CSS、フォント) ごとに分類されたファイルのリストが下に表示されます。 ON/OFF スイッチャーを使用して、そのファイルをここから除外できます。
これにより、ファイルを除外することができ、リソースの縮小時に発生する可能性のある問題を簡単に解決できます。グループ化と縮小のプロセスには、特にテストの場合にまだ作業が必要ですが、努力する価値は間違いなくあります。 WP Speed of Lightから直接速度テストを実行することで、いつでも動作をテストできます。
さあ、 WP Speed of Light: https://www.joomunited.com/wordpress-products/wp-speed-of-light
ブログを購読すると、サイトに新しい更新があったときに電子メールが送信されるので、見逃すことはありません。
コメント