CMS災害の回避:Webサイトのパフォーマンスを向上させる方法

公開: 2022-04-15

誰も…待つ…待つ…を好まない。 待って

デジタルスーパーヒーローのように機能するサイトを持つことは、特に潜在的な顧客が組織を調査していることで第一印象を与える場合、ビジネス上不可欠です。

次のWebサイトのパフォーマンス統計は、ブランドマーケティングチームは言うまでもなく、すべてのサイト開発者およびエンジニアの心に恐れを抱かせるはずです。

  • 読み込みに4秒以上かかる場合、ユーザーの2人に1人がサイトを放棄します。 出典:BBC。
  • 1秒の遅延により、ユーザーの満足度が16%低下します。 ソース:LoadStorm。
  • ページの読み込みに3秒以上かかる場合、モバイルサイトへのアクセスの53%が放棄されます。 出典:Google。

おそらく、GoogleのCore Web Vitalsのパフォーマンス指標を確認すると、サイトのパフォーマンスが低下していることに気付いたかもしれませんが、それを改善する方法がわかりませんか?

あなたのビジネスがオンラインになっているとき、あなたは他の場所に新しいビジネスを送り、あなたのコンテンツ管理システム(CMS)に貧弱なデジタル体験を提供させることによってあなたのブランドを傷つける余裕はありません。

以下では、5つの一般的な速度低下の原因と、WordPressVIPなどのアジャイルCMSを使用してWebサイトのパフォーマンスを向上させる方法を診断します。

まず、Webアプリケーションをロードすると実際に何が起こりますか?

ミリ秒単位で多数のアクションを実行し、すぐにハイギアを開始する必要があるブラウザにとっては、大きな要望です。 これがMozillaのやせっぽちの礼儀です:

  1. ブラウザはDNSサーバーに移動し、Webサイトが存在するサーバーの実際のアドレスを見つけます。
  2. ブラウザはサーバーにHTTP要求メッセージを送信し、Webサイトのコピーをクライアントに送信するように要求します。 このメッセージ、およびクライアントとサーバー間で送信される他のすべてのデータは、TCP/IPを使用してインターネット接続を介して送信されます。
  3. サーバーがクライアントの要求を承認すると、サーバーはクライアントに「200 OK」メッセージを送信します。これは、「もちろん、そのWebサイトを見ることができます。 ここにあります。" 次に、データパケットと呼ばれる一連の小さなチャンクとしてWebサイトのファイルをブラウザに送信し始めます。
  4. ブラウザは小さなチャンクを完全なWebページにアセンブルし、表示します。

注:もちろん、これほど簡単ではありません。 これらのそれぞれの間に多数の小さなステップがあります。 ここでは、「速度低下」が発生する5つの主な理由と、WordPressVIPCMSがそれらをどのように軽減するかについて詳しく見ていきましょう。

では、ブラウジングエクスペリエンスが遅くなる原因は何ですか?

犯人1.PoPとCDNの欠如

おそらく、あなたのビジネスはグローバルです。 これにより、さまざまなデバイスのさまざまな接続タイプのユーザーに対して、高速で一貫性のある安定した接続を確保するというロジスティック上の課題が増加します。

では、これはアプリケーションにとって何を意味するのでしょうか。

上記の手順2からネットワーク要求が開始されると、要求は複数のネットワークホップを通過します。 ホップは、パケットが送信元から宛先まで通過するルーターの数を指すコンピューターネットワーク用語です。

ユーザーの地理的な場所からサーバーへのこれらのホップの結果として、ロード中にユーザーが経験する時間が追加される可能性があります。 これは、コンテンツ配信ネットワーク(CDN)とPoint of Presence(PoP)を介して、訪問者の近くにコンテンツを配信することで軽減できます。

WordPress VIPの回答

WordPress VIPのCDNは、エッジとオリジンのPoPのグローバルネットワークであり、サイトをグローバルな顧客に可能な限り迅速、効率的、かつ確実に提供します。 このローカライズされた可用性は、エッジサーバーにアプリケーションからの新しいコンテンツが通知されるとすぐに自動的に発生します。 これは、チームが処理する追加の構成がないことを意味し、チームが他のタスクに集中できるようにします。

犯人2.最適化されていないメディア

誰もが最新のモバイルデバイスで今日撮影しているこれらの高品質の画像は非常に美しいです! つまり、ホームページでサムネイルとして使用されるまでです。

4K画像を追加し、それを100×100ピクセルのコンテナに制限すると、ユーザーは4K画像全体を読み込む必要があります。 単一の画像はそれほど心配する必要はありませんが、コンテンツを大規模に公開している企業の場合、ページの読み込みは、インデックスページに表示される記事が増えるほど簡単に指数関数的に爆発する可能性があります。

WordPress VIPの回答

WordPress VIPのアプリケーションは、エッジキャッシュされた画像のすべての利点と、アップロードされた画像の自動画像サイズ変更を自動的に受け取ります。 さらに、画像はその場でサイズ変更できます。

犯人3.最適化されていないJavascriptとCSS

大きなファイルをロードする場合、すべてのビットとすべての要求が重要になります。 ファイルのダウンロードにかかるネットワークホップ数をすでに最適化している場合、ファイルの到着にかかる最大の時間は、要求の開始と終了です。

これに対処するために、最近のJavascriptとCSSの開発では、ミニファイと連結を使用することがよくあります。

縮小とは、ファイル内のすべての不要な文字、通常はすべての不要な空白を削除することです。 ここでの目的は、転送されるビットの総数を減らすことです。
連結とは、複数のファイルを結合して1つの大きなファイルを作成することです。 ここでの目的は、ネットワーク要求の数を減らすことです。

WordPress VIPの回答

WordPress VIPは、JavaScriptファイルとCSSファイルを自動的に連結して、1ページの読み込みで発生するリクエストの数を減らします。 CSSファイルは、連結されるだけでなく縮小されます。 クレジットは、選択したオープンソースプラグインに割り当てられます。

縮小および連結されたファイルは、15日間、または変更が検出されるまでキャッシュされます。

犯人4.キャッシュ使用率が低い

キャッシュは、処理を高速化するための特別な一時ストレージです。 何が高速化するかは、キャッシュのタイプによって異なります。

キャッシュの形式を使用していない場合、アプリケーションに負荷がかかっているときにページの応答速度に深刻な影響を与える可能性があります。

WordPress VIPの回答

WordPress VIPは、いくつかの異なるタイプのキャッシュを採用しています。

  • オブジェクトキャッシュ—アプリケーションレベルのデータを保存するために使用されます。 これにより、データベースにアクセスすることなく、データを迅速かつ効率的に取得できます。 つまり、オブジェクトキャッシュは、大規模な計算やクエリが貴重な接続時間を消費するのを防ぎます。
  • クエリキャッシュ—データベースクエリの軽量メモリキャッシュ。 WordPressでは、WP_Query APIを利用するポストクエリは、この形式のキャッシュから大きな恩恵を受けます。
  • ページキャッシュ—完全に描画されたページのストレージ。各エッジのPoPの場所に保存されます。 これは、アプリケーションにアクセスするほとんどのユーザーが遭遇する最初のレベルのキャッシュです。 ページキャッシュを使用すると、アプリケーションでコードを実行しなくても、CDNでローカライズされたコンテンツを提供できます。

これらはすべて調和して機能し、要求の応答時間を短縮します。

問題5.データベース接続の飽和

アプリケーションのコンテンツとユーザーベースが大きくなると、元々正常に実行されていた古いデータベースクエリによって、パフォーマンスが低下する可能性があります。

クエリの実行に時間がかかる場合、クエリが終了するまで、これはデータベースのシートを占有します。 これらのシートがすぐにいっぱいになり、その後、それ以上のクエリが実行されなくなることがあります。 これは通常、データベースが500の応答を提供するまで、アプリケーションのパフォーマンスの低下として現れます。

接続の飽和は迅速かつランダムに発生する可能性があり、根本原因の診断が困難になります。

WordPress VIPの回答

WordPress VIPサービスパッケージの一部として、New Relicへのアクセスを提供します。これは、上記のような潜在的な問題を事前に診断および監視するのに役立ちます。 これにより、チームの時間、コスト、および秒数が重要なときに追加のツールやリソースを確保する手間を省くことができます。

結論は

ネットワークホップやポイントの欠如からデータベースコンテンツの飽和に至るまで、Webサイトのパフォーマンス低下の根本原因に対処することは、先進的な組織とそのコンテンツ管理システムにとってP0の優先事項である必要があります。 結局のところ、オーディエンスとの素晴らしい第一印象を与えることは、デジタル時代のすべてです。 スピードは本当に殺すからです。

WordPress VIPの詳細については、こちらをご覧ください。

著者

WordPress VIP、シニアソフトウェアエンジニア、Michael Chan