スクリプトとスタイルを自動的に最適化することは両刃の剣です

公開: 2020-11-18

確かにあなたはインターネットのどこかでWPOの重要性について話している教祖を聞いたことがあるでしょう。 この頭字語の意味を確認することに加えて、あなたはその教祖のアドバイスがあなたのウェブサイトを最適化しそして最終的にそのパフォーマンスを高めるための鍵であると思ったかもしれません。

私はそれを疑う人ではありません。 WPOは重要ですが、その人がどんなに頭が良いとしても、そこにいる専門家が提供するアドバイスのいくつかを実践するときは、非常に注意する必要があります。

WordPressでは、Webサイトのパフォーマンスを向上させるためにインストールする必要のある一連のプラグインがあることをよく読んでいます。 ここにSEOプラグイン、そこにキャッシュプラグイン、セキュリティプラグインが常に必要です…要するに、ポケモンビデオゲームのように見えるWordPress初心者を教えるための典型的な話：すべて（プラグイン）をキャッチする必要があります！

常識は、最も一般的ではありませんが、WordPressでは、必要な機能の最大数をカバーするために、可能な限り少ない数のプラグインを使用する必要があることを示しています。 既存のプラグインをすべてインストールする必要はありません。 実際、これは推奨される方法ではありません。 Webサイトの最適化は、単純なプラグインをインストールするよりも複雑です。

WordPressの奇跡的なプラグインに注意してください

しかし、WPOの前のトピックを続けます。これは、WordPressで非常に人気のあるタイプのプラグインであり、スクリプトとスタイルを縮小して組み合わせることにより、Webサイトの速度を向上させます。 ほとんどの場合、これらのプラグインは、Webサイトのパフォーマンスメーターで100を達成するための特効薬として販売されています。 その想定される利点の中には、次のものがあります。

  1. CSSスタイルとJavaScriptスクリプトを縮小してサイズを縮小し、ダウンロードにかかる時間を短縮します。
  2. これらはすべてのCSSスタイルとJavaScriptスクリプトを組み合わせているため、訪問者は1つのCSSファイルと1つのJavaScriptスクリプトのみをロードし、サーバーに対して行う必要のある要求の数を減らします。
  3. Webがスクリプトのロードを待たずに実行が続行されるように、 asyncタグとdeferタグを配置します。
  4. 絵文字などの不要な要素を削除します。
  5. 画像の遅延読み込みを適用して、ウェブサイトの読み込み時間をさらに短縮できます。

わかりました、それは完璧です。 しかし、あなたが細字を読まずに自動最適化プラグインをインストールしてアクティブ化する人の一人であるならば、あなたのウェブサイトが壊れる可能性が非常に高いとあなたに申し訳ありません。

WordPressプラグインを使用してスクリプトを追加および縮小することは、両刃の剣になる可能性があります。
WordPressプラグインを使用してスクリプトを組み合わせて縮小することは、両刃の剣になる可能性があります。

自動最適化プラグインは万能薬のように見えるかもしれませんが、最終的にWebサイトを地雷原に変える可能性もあります。 そして、はい、あなたは1つを踏んであなたのウェブサイトの一部を破裂させずにそこを離れることはありません。

その理由は簡単に説明できます。 JavaScriptスクリプトを1つのファイルに結合して縮小するWordPressプラグインは、これらのスクリプトの実行順序を維持できない場合があり、多くのエラーが発生します。

WordPressでスクリプトをエンキューする正しい方法を確認する場合は、 wp_enqueue_script()関数の定義を確認する必要があります。

 wp_enqueue_script( string $handle, string $src = '', string[] $deps = array(), string|bool|null $ver = false, bool $in_footer = false )

この関数の3番目のパラメーターは、依存関係のリストです。これは、キューに入れているスクリプトが適切に動作するために必要な他のスクリプトの名前にすぎません。 これは、スクリプトが実行されるまでに、そのすべての依存関係がすでにサイトにロードされている必要があることを意味します。

スクリプトがキューに入れられる順序は重要であり、依存関係も重要です。 wp_enqueue_script関数を使用すると、WordPressが正しい順序を作成し、スクリプトがページに正しく読み込まれるようにします。

問題は、JavaScriptファイルを最小化して結合するプラグインを使用する場合、結合の結果として生じるJavaScriptファイルが、定義した実行の順序と依存関係を尊重しない可能性があることです。 そして、これがJavaScriptコードを機能させない原因です。

機能を実装するためにWordPressWebサイトで毎日より多くのJavaScriptを見つけていることを考慮に入れると、このタイプのプラグインをインストールして、狂ったようにアクティブ化することは非常に問題になる可能性があります。

私のウェブサイトは機能しません。 誰のせいですか？

WordPressプラグインの開発者として、他のプラグインの機能に注意を払い、影響を最小限に抑えるようにすることが私たちの義務です。 ただし、プラグインの1つをインストールすると、Webサイトが破損するという苦情を申し立てる、プラグインのユーザーに出くわすことがよくあります。

徹底的な調査の結果、スクリプトを組み合わせてプラグインの実行時にJavaScriptエラーが発生するこれらの最適化プラグインを使用しているため、問題が何度も発生します。 また、Web上のすべてのJavaScriptが1つのスクリプトにマージされるため、そのスクリプトの実行を停止する障害が発生した場合、他のスクリプトも機能しないことにも注意してください。

その結果、ユーザーがインストールにアクセスできるようになるまでメッセージを交換する時間の無駄が生じ、問題はプラグインを使用して自動最適化することがひどいことであることが最終的にわかります。 そのため、これを読んでいて、WordPress Webサイトを持っている場合、スクリプトとスタイルを自動最適化するためのプラグインは、適切に構成しないと両刃の剣であることに注意してください。

WordPress用のAutoptimizeプラグインの設定画面。ここからスクリプトとスタイルを除外できます。
WordPress用のAutoptimizeプラグインの設定画面。ここからスクリプトとスタイルを除外できます。

解決策は、自動最適化プラグインで機能しないスクリプトを縮小および組み合わせプロセスから除外することです。 含めるスクリプトがわかっていれば、難しいことではありません。 しかし問題は、これらの自動最適化プラグインのユーザーがこれを行うことはめったにないということです。

自己防衛策として、プラグイン開発者は、スクリプトをデフォルトの組み合わせから除外し、これらの他のプラグインが行う縮小化のために、コードに互換性フィルターを含める必要があります。 時間がかかることに加えて、常に達成できるとは限らないこと。

細心の注意を払って自動最適化プラグインを使用する

この記事の後、私はプラグインの自動最適化が嫌いであるという誤った信念を持ってほしくありません。 彼らの成功は、彼らが有用であり、人々の問題を解決するという明確な識別子です。 SiteGroundが自社のWebサイトで提供する自動最適化プラグインをアクティブ化したこともあります。

ただし、次の点に注意してください。これらのタイプのプラグインを使用する場合、単にそれらをアクティブ化することはできません。 特定の条件に従って正しく構成できるようにするには、Webサイトで徹底的にテストする必要があります。 新しいプラグインをインストールするたびに、縮小/組み合わせプロセスが機能し、Webサイトが引き続き応答することを再確認する必要があります。

少し責任を持って注意を払うことで、スクリプトとCSSスタイルを最小化して自動最適化プラグインと組み合わせる際に発生する問題を大幅に減らすことができます。

UnsplashのMarkusSpiskeの注目の画像。