ECサイトはスピードが命。オンラインストアが高速であればあるほど、ユーザーのショッピング体験が向上します。より良いユーザー体験は、SEO、ROI(投資利益率)、顧客の満足度の向上につながり、結果として、より大きな収益を獲得することができます。
今回の記事では、WooCommerceストアを高速化する18のヒント、そしてKinstaのホスティングサービスでパフォーマンスを最適化し、セキュリティを強化する方法を見ていきます。
高解像度の画像や動画、ライブチャット、ユーザーレビュー、リアルタイムの在庫管理、パーソナライズされた顧客体験など、オンラインでの買い物が当たり前になった今日、多くの人がより良いものを期待しています。このような機能がスムーズに動作しないと、ECサイトの動作が重くなり、買い物客が途中でサイトを離脱してしまう確率が高まります。
WooCommerceは、500万以上のウェブサイトで使用されており、最も人気のある無料ECプラットフォームです。ダウンロード回数は、なんと2億5,200万回以上。他のプラットフォームとは異なり、売上に対する手数料が発生しません。
オンラインショップの成功の鍵は、スピードが握っていると言っても過言ではなく、低速なストアはユーザーの不満や売上の損失につながります。また、速度はSEOやGoogleの検索アルゴリズムにも影響を与えます。ECサイトでは、1ミリ秒が売り上げを左右します。サイトのパフォーマンスとトラフィックの急増にも対応できる環境を整えておくことは不可欠です。
Kinstaの高性能ホスティングと最適化により、ページの読み込み時間が50%短縮されました。『Shark Tank』(アメリカのリアリティ番組)に出演後、トラフィックが急増しましたが、サイトはダウンすることなく、6時間に100万以上のページビューを提供することができました。
Kevin McAloon氏|デザイナー兼フロントエンド開発者|DARTDrones(英語原文の日本語訳)
Kinstaでは、WooCommerceストアの速度、パフォーマンス、セキュリティ、サポートを最適化し、WooCommerceストアの高速化を目的としたさまざまな機能を提供しています。
- コンテナ技術:サイトリソースをコンテナ化する独自のインフラストラクチャにより、リソースが共有されることがありません。これによって、サイトごとのパフォーマンスレベルが向上します。コンテナ内にストアを隔離することで、他のサイトからの干渉を受けることなく、より良い速度、安全性、および安定性を確保。また、潜在的なリソースの盗用を心配することなく、パフォーマンス問題のトラブルシューティングに費やす時間を最小限に抑えることができます。
- GCPインフラストラクチャ:プレミアムティアネットワークと高性能C2およびC3Dマシンで、WooCommerceストアが信頼性の高いプラットフォーム上で動作。GCPのプレミアムティアネットワークにより、サイトへのトラフィックとサイトからのトラフィックが世界中にルーティングされます。
- 世界37箇所にあるデータセンター:訪問者に近い場所にあるデータセンターを選択して、コンテンツの配信を高速化。複数のECサイトを運用している場合は、複数のデータセンターを選択可能です。すべてのサイトを一箇所のデータセンターに集中させる必要はありません。
- エッジキャッシュ:サイトのコンテンツを世界中の複数の都市から配信し、データの移動距離を短縮。サイトとページのキャッシュがCloudflareのグローバルネットワーク260+のデータセンターに保存されます。このエッジキャッシュは、すべてのプランに無料で付帯しており、追加のプラグインなどは不要です。キャッシュされたWordPressのHTMLページを提供するのに必要な時間を50%以上削減します。
- サーバーレベルのキャッシュ:Kinsta独自のキャッシュで、ストアのパフォーマンスを最適化。WooCommerceに最適化されたルールも含まれており、買い物カゴ、アカウント画面、決済画面などの重要なページはキャッシュから除外されます。これにより、動的なユーザー体験が保証され、ページの高速表示を実現します。
WooCommerceストアの速度を測定する
速度を測定できなければ、改善することもできません。
したがって、まずはウェブサイトのスピードテストを行うことが重要です。速度改善後に正しい結果を得るため、テストは適切に行いましょう。
テストツールは、WebPagetest、Pingdom、Google PageSpeed Insights、GTMetrixなどがおすすめです。
無料のWordPressプラグインであるQuery Monitorを使用して、低速なテーマ、プラグイン、機能を特定することも可能です。非効率なデータベースクエリ、肥大化した関数、PHPエラー、HTTP API呼び出しなどをデバッグするのに役立ちます。
どのテストツールも完璧とは言えませんが、使用するツールは1つに絞り、複数を同時に併用することは避けてください。
各ツールはそれぞれに違う指標を持っていても、各指標はそのツールにおいて正確なデータ。完璧なツールはないから、単に好きなものを選べば問題ない
また、実際のパフォーマンスとユーザーが体験するパフォーマンスには差異があります。ユーザーエクスペリエンスは、サイトを動かす技術的な側面よりも重要です。
そのため、単に高いスコアを目指すだけでなく、これからご紹介するヒントを実践して、サイト全体でのユーザー体験を改善しましょう。
WooCommerceを高速化する方法
スピードテストの結果を分析することで、WooCommerceストアのパフォーマンスを最適化する方法を見極めることができます。
1. 優れたホスティングサービスを利用する
パンクしたタイヤで車を走らせるのと同じように、利用するサーバーの質が低ければ、いくら最適化しても限界があります。サイトパフォーマンスの大部分は、ホスティングの質に依存します。
通常ホスティングサービスでは、異なる価格帯のプランが複数用意されています。予算が決まっている場合は、その予算内で要件を満たしてくれる機能が揃ったサービスを選択しましょう。
WooCommerceストアは高度に動的なサイトで、キャッシュできないデータやリクエストが大量に生成されます。
例えば、決済ページは買い物客ごとに異なるため、キャッシュから提供することはできません。たとえトラフィックが少ないサイトであっても、サーバーには、サイトを円滑に運営できるだけの堅牢性が求められます。
WooCommerceストア用のホスティングサービスを選ぶ際に注目したい機能、そしてKinstaのホスティングサービスの機能は、以下の通りです。
- WooCommerce専用のキャッシュルールを設定したサーバーレベルのキャッシュ─Kinstaではすべてのプランに付帯。
- 128MB以上のWordPressメモリ制限─Kinstaのメモリ制限はデフォルトは256MBに設定。
- トラフィックと負荷の急増に対応するスケーラブルなインフラストラクチャ─Kinstaはスケーラブルな隔離コンテナ技術を採用。
- 顧客データの安全性を確保する毎日の自動バックアップ(できれば1時間ごと)─Kinstaでは、毎日、毎時、手動、システム生成、ダウンロード可能、および外部バックアップ(Amazon S3またはGoogleクラウドストレージ)の6種類のバックアップが利用可能。バックアップデータは常時2週間分保存され、保存期間を延長することも。
- セキュアなホスティングプラットフォーム─Kinstaでは、定期的なマルウェアスキャン、IPジオロケーション、不正なIPアドレスのブロック、無料のSSL、SFTP、SSH、HTTP/3、TLS 1.3、エンタープライズレベルのファイアウォールとDDoS対策がすべてのプランに付帯。
- 読み込み時間の短縮とパフォーマンスの向上のためのウェブサーバーソフトウェア─KinstaではすべてのホスティングにNginxを使用、プランを問わずすべての対応リージョンでコンピューティングに最適化されたC3D VMを採用、コンテナ技術によりリソースの共有なし。
- PHP 8、LXCコンテナ、WP-CLI、Git、MariaDB、ステージング環境などの開発者向け機能─Kinstaでは、PHP7.4, 8.0, 8.1, 8.2, 8.3 , 8.4(本番サイトとステージングサイトごとに異なるバージョンを設定可能)をサポートし、ワンクリックでバージョンを変更可能。
- 世界各地に設置されたデータセンターから訪問者に近いサーバーを選択し、高い稼働率を確保できるサービス─Kinstaでは自己修復PHPシステムを採用し、すべてのサイトを1日480回(3分ごと)監視。さらに99.9%の稼働率を保証。
- パフォーマンスとセキュリティを向上させるCloudflare統合─Kinstaでは、独自のルールセットとDDoS攻撃対策を備えたエンタープライズレベルのファイアウォールを含むCloudflare統合がすべてのプランにデフォルトで付帯。
- 信頼できる24時間のカスタマーサポートと迅速な応答─Kinstaでは、エンジニアによる24時間年中無休のカスタマーサポートをすべてのプランで利用可能。追加費用なしで平均応答時間は2分以内。
私たちは、10年以上にわたって様々なホスティング会社と仕事をしてきました。プラットフォームの中核となる技術的な機能は、すべてのプロジェクトにとって非常に重要です。テストサイトの速度を測定したところ、KinstaのネットワークはAWSでホストするサイトよりも表示速度が1秒速いことがわかりました。
Kresimir Koncic 氏|ディレクター|Neuralab(英語原文の日本語訳)
優れたホスティングサービスは、WooCommerceストアのパフォーマンスの鍵を握る存在。上記で挙げたすべての機能は、KinstaのWordPress専用マネージドホスティングに組み込まれています。ホスティングサービスの違いについては、この記事の最後でご紹介します。
2. WooCommerceの設定を最適化する
続いて、WooCommerceプラグインの設定を最適化する方法をご紹介します。
まずは、ログインページのURLを変更すること。すべてのWordPressサイトのデフォルトログインURLは「domain.com/wp-admin/」。覚えやすいURLではありますが、裏を返せば、ボットや悪意のある第三者もこのURLを知っていることを意味します。
ログインページを独自のURLに変更することで、ブルートフォース攻撃(総当たり攻撃)からサイトを保護することができます。また、「429 Too Many Requests」のようなHTTPエラーのレート制限への対処にも。
URLの変更は、無料のプラグインのWPS Hide LoginやRename-wp-loginなどで簡単に実現可能です。
ECサイトでブログも運用している場合、ブログフィードの投稿数を制限することができます。デフォルトの投稿数は10件に設定されていますが、さらに件数を減らすこともできます。
一見些細な変更ですが、トラフィックの多いブログであれば、消費するリソースを削減することができます(サイトにトラフィックを誘導する方法はこちら)。この設定は、WordPressの管理画面から「設定」>「表示設定」を開きます。
次に、サイトのピンバック機能を無効にします。この機能を有効にしておくと、余計なスパムが発生する可能性があります。サイトが生成するクエリは、少なければ少ないほど良いとされます。
投稿や固定ページに多くのコメントがある場合は、小さな塊として分割する機能も。これは、商品ページのユーザーレビューにも適用可能です。
この数値を10~20に保つことで、商品ページの表示速度を最適化することができ、サイトの立ち上げや人員配置に費やす時間の削減につながります。
商品レビューは、「WooCommerce」>「設定」で非表示に設定することができます。一定数のスクリプトやウィジェットを読み込む必要がなくなり、WooCommerceストアの高速化に効果的です。
また、不要なテーマや古いプラグインは削除すること。インストールしているテーマやプラグインが少ないほど、メンテナンスやパフォーマンス問題のトラブルシューティングが容易になります。
3. 高速なWooCommerceテーマを使用する
適切なWooCommerceテーマ選びも重要です。とは言え、何十万ものテーマがリリースされており、適切なテーマを見つけ出すのは至難の業。
優れた機能を持つ洗練されたテーマは、一見理想的であっても、実際に使用するとそうではないことも。ECサイトの場合は、まずWooCommerceと互換性があることは必須条件です。
WP Rocketは、人気の高いWooCommerceテーマの速度をテストしています。結果は以下のようになりました。
ElementorやBeever Builderのようなページビルダーと駆使すれば、どんなサイトでも作成することができますが、肥大化を考慮し、使用しないことをおすすめします。その代わりに、WordPressのブロックエディター(Gutenberg)対応のテーマを選びましょう。
無料と有料のテーマがありますが、どちらを使うにしてもECサイト向けに設計されたテーマを選びましょう。
予算に限りがある場合は、まずは無料テーマを使用して、後からアップグレードするというのも手です。
テーマを賢く選ぶには、まず必要な機能を書き出してみてください。そしてその機能を網羅しているテーマを探しましょう。こうすることで、肥大化した多目的テーマやサードパーティプラグインへの依存を最小限に抑えることができます。
選択したテーマは、WooCommerceサイトのパフォーマンスに直接影響を与えます。テーマが軽量であればあるほど、パフォーマンスが向上すると考えてください。テーマの重さは、GoogleのPageSpeed Insightでテストすることができます。
これは、次のヒントにもつながります。
4. プラグインと拡張機能はインストールしすぎない
WordPressのリポジトリには、6万以上の無料プラグインが存在しており、有料プラグインの数はそれ以上。そのため、ついついいろんなプラグインをインストールしがちです。
人気プラグイン(特にパフォーマンスやセキュリティ関連)の多くは、実は特定のホスティング環境でスムーズに動作しません。
WooCommerceの機能は、無料・有料の包括的なWooCommerce拡張機能で強化することができます。この拡張機能は、WordPressプラグインと同じ仕組みです。
一般的な認識とは異なり、インストールするプラグインの数が必ずしもパフォーマンスに悪影響を与えるとは限りません。ただし、これはプラグインのコーディングが最適化されている場合に限ります。
プラグインの数が多すぎると、インストールしているすべてのプラグインの質を検証するのが面倒に。またもちろん、検証に必要な専門知識を持ち合わせていることが前提条件です。
プラグインの中には、他のプラグインと競合するものもあり、サイトに何十ものプラグインを実装していると、競合が発生する確率は物理的に上昇します。
したがって、WordPressプラグインやWooCommerce拡張機能は、よく吟味した上でインストールしてください。
Kinstaのホスティングソリューションを利用する場合は、エッジキャッシュ、バックアップ、セキュリティ強化策、パフォーマンス最適化などの機能がすでに内蔵されているため、必要になるプラグインの数を削減することができます。プラグインの数を減らせば、必然的にサイトが高速化されます。
5. WordPressのメモリ制限を増やす
WordPressは、デフォルトでPHPのメモリ制限を32MBに設定しています。何らかの問題が発生した場合は、自動的にこの制限を40MB(単一サイト)または64MB(マルチサイト)に引き上げられます。
ほとんどの場合、このメモリ制限は、WooCommerceストアには不十分です。管理画面に、以下のようなエラーメッセージが表示されることがあります。
「Allowed memory size of xxxxxx bytes exhausted(許容メモリサイズはxxxxxバイトです)」
メモリ制限は256MBに増やすことをお勧めします。なお、この変更を加える前に、必ずファイルをバックアップしておきましょう。万が一何か問題が発生しても、元のファイルの状態に復元することができます。
6. 画像を圧縮してコンテンツ配信を最適化する
画像はサイトのページサイズの大部分を占めるもの。WooCommerceストアには、商品画像やバナーが欠かせません。
画像サイズを最適化しなければ、サイトが超低速になる可能性も。🐌
HTTP Archiveは、一般的なウェブページのサイズと量を分析しています。WordPressサイトの状況は以下の通りです。
HTTP Archiveの画像に関するレポートによれば、非表示画像やオフスクリーン画像を遅延読み込みすることで、1ページあたり545KB削減することができます。
Googleのモバイルサイト向け監査ツールのLighthouseの指標によると、JPEG圧縮レベルを85以下に設定すれば、さらに1ページあたり40.3KB削減することも。
以下5つのルールに従って、WooCommerceストア(およびウェブ全般)の画像を最適化してみてください。
- 画像に適切なフォーマットを選択する(JPEG、PNG、SVG、WebP)
- 適切なツールで画像を効果的に圧縮する
- レスポンシブ画像を使用して、あらゆるデバイスへの配信を最適化する
- オフスクリーンや非表示の画像を遅延読み込みする
- CDNを使用して画像を高速配信する
WordPress 3.3では、リアルタイム(オンザフライ)のサムネイルリサイズ、画像のピンボケ補正、バックグラウンドでのサムネイルリサイズなど、画像サイズを改善する機能が導入されています。このような機能によって、WooCommerce関連の画像にRegenerate Thumbnailsのようなプラグインを使用せずに済みます。
これから使用する画像については、サイトにアップロードする前に圧縮することができます。おすすめのオンラインサービスは以下の通り。
すでに多くの画像を使用している場合は、WordPressプラグインを使って画像の最適化を自動化することができます。以下のプラグインがおすすめです。
また、通常この手のプラグインは、画像の遅延読み込みも設定可能です。WordPress 5.5以降は、遅延読み込み機能はコアに組み込まれ、非常に簡単に実装できます。
画像の最適化について、最後にもう一点だけ。画像圧縮プラグイン、特に画像を圧縮するのにサーバーのリソースを消費するものはできるだけ避けてください。
その代わりに、画像圧縮の負荷を外部サーバー分散するサービスを使用してください。または、サイトに画像をアップロードする前に、リサイズして圧縮するのも手です。
パフォーマンスのための画像最適化に関する詳細はこちらをご覧ください。
7. CDN経由で静的リソースを配信する
コンテンツデリバリネットワーク(CDN)は、世界中に配置された配信ネットワークで、各サーバーロケーションは、PoP(Point of Presence)と呼ばれます。
CDNの主な機能は、画像、JavaScript、CSSなどの静的リソースをキャッシュして配信すること。高性能なCDNであれば、音声や動画のような動的コンテンツを提供することもできます。
たとえサイトを超高速サーバーで稼働していても、地理的な位置によって制限が生じることも。WordPress CDNは、個々のユーザーとサイトのリソースとの間の距離を縮め、ネットワークレイテンシとTTFB(Time To First Byte)の両方を改善してくれます。
リクエストの送信元に応じて、自動的に最も近いCDNのPoPを割り当て、キャッシュされたリソースを配信することで、サイトが高速化され、ユーザーエクスペリエンスも向上します。
KinstaでWooCommerceストアを運営すると、260+のPoPに支えられたCDNを利用して、最高速度を実現することができます。
例えば、アメリカのサーバーで運営されているオンラインストアに、インドのバンガロール在住のユーザーがサイトにアクセスするとします。すると、CDNがそのユーザーに最も近いPoPからサイトのアセットを配信します。
一般的なルールとして、PoPの数が多ければ多いほど、そしてそのネットワークが広ければ広いほど、各ユーザーへのサイトの配信が高速化されます。
Kinstaで自社のCDNをテストしたところ、CDNを利用すると、ホスティングサーバーから地理的に離れた場所にいるユーザーに対して、サイトの読み込み時間が50%以上短縮されました。
キャッシュ以外にも、高度なオンザフライ画像圧縮、HTTP/3対応、直リンク保護、その他セキュリティ強化策など、パフォーマンスを向上させる機能が多数揃っています。
WooCommerceストアの速度を向上させるには、高速なCDNを利用してください。KinstaではCloudflareの高性能CDNをすべてのお客様に提供。世界中の260+PoPからコンテンツを配信し、パフォーマンスを向上します。
8. 未使用のスクリプトとスタイルシートを削除する
ほとんどのWordPressテーマとプラグインは、サイトのすべてのページでスクリプトとスタイルシートを読み込みます。そのため、そのページ不要なアセットも読み込まれています。
例えば、お問い合わせフォームを作成できるプラグイン、「Contact Form 7」は、すべてのページでスクリプトとスタイルシートを読み込みます。通常、お問い合わせフォームは、お問い合わせページでのみ使用できれば問題なく、それ以外でのページでの読み込みは無駄な処理に。
このような不要なアセットをページから取り除くことで、肥大化を抑え、ページの表示速度を向上することができます。WooCommerceとその拡張機能(Smart CouponsやFollow-Upsなど)には、特にこのような問題が見られます。
例えば、ストアのトップページや商品一覧ページで、決済ゲートウェイに関連するスクリプトを読み込む必要はなく、決済画面と注文確認画面のみに制限することができます。同様に、決済ページからスライダーやカルーセル用のスクリプトやスタイルを取り除くのも名案です。
どのアセットを削除すべきかを確認するには、サイトのスピードテスト結果の滝グラフが便利です。読み込まれている不要なアセットを把握することができます。
Chromeのデベロッパーツールにある「ネットワーク」タブでも確認可能です。ウェブページがどのように、そして何を読み込むのかを包括的に見ることができます。
各ページに不要なスクリプトやスタイルは削除してしまいましょう。まずは、トップページやランディングページから始めましょう。
トップページとランディングページの場合は、wp_dequeue_script
とwp_dequeue_style
関数を使って、不要なスクリプトやスタイルを削除することができます。または、Asset CleanUp: Page Speed Boosterプラグインを使用してもOKです。
Asset CleanUpは、ページに読み込まれているすべてのスクリプトとスタイルシートをスキャンし、ページで使用されていないものを無効化してくれます。変更を終えたら、ページが正常に動作するかを確認してください。
このプラグインの有料版では、async属性またはdefer属性を設定することもできます。ページの大事なレンダリングパスからJavaScriptが除外され、表示速度が改善されます。
不要なCSSやJSアセットを削除することで、サイトのHTTPリクエスト数を減らすことができます。
AutoptimizeとAsync JavaScriptプラグインを組み合わせても、同様の効果が得られます。Autoptimizeプラグインの適切な設定方法はこちらでご紹介しています。
9. 少なくともHTTP/2、できればHTTP/3
数年前であれば、このセクションのタイトルは、「HTTPリクエスト数を削減する」だったでしょう。この点は、ブラウザとサイト間の通信方法が大幅に改善されたおかげで、今では考慮しなくてもOKです。
1997年に開発されたHTTP 1.1は、2015年にHTTP/2に改良され、多重化やSever Push機能によって、速度、効率、セキュリティが強化されました。そして最新バージョンであるHTTP/3は、QUICをベースに、接続確立の改善、HoL(Head of Line)ブロッキングの低減、暗号化の強化などが導入され、さらにパフォーマンスとセキュリティに最適化されています。
これによって、サイトに複数のリソースがあっても、より高速に読み込まれるようになります。
通常WooCommerceストアは、画像、スタイルシート、スクリプトなど、リソースを大量に消費するアセットを持っているため、HTTP/3には大きなメリットがあります。
現在は、主要なブラウザはすべてHTTP/2をサポートしていますが、HTTP/3のより良いパフォーマンスとセキュリティを利用しない手はありません。
お使いのホスティングサービスがHTTP/3をサポートしていない場合は、乗り換えどきかもしれません。Kinstaでは、すべてのサーバーとCDNでHTTP/3とTLS 1.3をサポートしています。
10. WooCommerceをキャッシュして高速化する
キャッシュとは、あるリクエストからのリソース(キャッシュ)を一時的に保存し、それ以降のリクエストを素早く処理できるようにする仕組み。キャッシュはサーバーまたはユーザーのデバイスに保存されます。
キャッシュの活用は、WooCommerceストアを高速化する簡単かつ最も重要な方法です。先にも触れましたが、Kinstaでは、キャッシュされたHTMLページを配信するエッジキャッシュとサーバーレベルのページキャッシュを提供しています。
ユーザーがサイトにアクセスしようとすると、DNSサーバーがホスティングサーバーからウェブページを取得し、ウェブサーバー上のアプリケーションがスクリプトを処理して、データベースに問い合わせ、ウェブページを構築します。
これは、1人のユーザーからの1つのリクエストの流れ。何千人ものユーザーから同時にリクエストを受けることを想像してみてください。サーバーに膨大な負荷がかかり、最終的にはサイト速度の低下につながります。
そんな状況を解決するのがキャッシュの存在。ページビューを生成するのに必要な作業量が減り、WordPressのPHPとデータベースへの依存も軽減します。キャッシュによって、静的サイトに近い速度で動作するようになります。
キャッシュには、大きく分けて2つのタイプがあり、それぞれでまた種類が枝分かれします。
サーバーサイドキャッシング
クライアントサイドキャッシュ
キャッシュはサイトを高速化するだけでなく、サーバーの負荷も軽減します。WordPressキャッシュに関する詳細はこちらをご覧ください。
KinstaでWooCommerceストアをホストする場合は、サーバーレベルでキャッシュが実装されているため、自動的にキャッシュが処理されます。キャッシュプラグインのインストールは不要です。
また、WooCommerceとシームレスに動作するよう、独自のキャッシュルールも設定されており、買い物客にスムーズな決済体験を提供することができます。
また、最新のウェブ標準であるEarly Hintsは、事前に読み込むリソースを指定することで、ページの表示速度を瞬時に改善し、ページのレンダリング速度が高速化されます。
お使いのホスティング会社がサーバーレベルのキャッシュを提供していない場合は、サードパーティのキャッシュプラグインが必要になります。これは理想的な解決策ではありませんが、何も使用しないよりは、使用した方がいいです。
WordPressキャッシュプラグインのおすすめは、以下の通り。
- WP Rocket(有料)
- W3 Total Cache(無料)
- Cache Enabler(無料)
その他のWordPressキャッシュプラグインに関してはこちらでご紹介しています。
11. WooCommerceデータベースをクリーンアップする
データベースは、サイトのすべてのデータを格納する場所。WooCommerceストアのデータベースには、以下のようなデータが含まれています。
- 商品ページ、カテゴリー、タグ、ユーザーデータ、レビュー、サイト全体の設定、テーマ、プラグインなどのサイトコンテンツ
- 注文詳細、支払い、在庫などの取引データ
ユーザーがストアにアクセスするたびに、サイトコンテンツがリクエストされますが、注文を行う際には、動的なリクエストが送信されます。
ストアのデータベースが最適化されていない場合、このリクエストの処理に時間がかかりすぎてしまう可能性も。サーバーの応答時間が遅ければ、当然サイトの速度も低下します。不要なデータを削除してデータベースをクリーンアップし、最適化を行いましょう。
データベースを最適化する方法はいくつかありますが、最善の策は、優れたホスティングサービスに移行すること。例えば、Kinstaでは、データベースのパフォーマンス最適化のため、サイトで24時間の継続的なMySQLデータベースの最適化とバックアップを提供しています。この場合、そもそもデータベースプラグインは不要です。さらに、KinstaのWordPress専用マネージドホスティングでは、バックアップの確認や最適化の管理も必要なく、必要な作業がすべて自動化されます。
それでは以下、WooCommerceストアを高速化するために、データベースをクリーンアップする方法を6つご紹介します。
古いリビジョンを削除する
WooCommerceストアを立ち上げてから時間が経過している場合、固定ページ、投稿、商品ページは古いリビジョンで埋め尽くされているはず。これをまずは一掃してしまいましょう。
一番簡単なのは、WP Rocketを使用する方法です。
WP-CLIを使いこなせる方は、SSH経由でサーバーに接続し、簡単なコマンドで実行することも可能です。以下、このコマンドを見ていきましょう。
保存するリビジョン数を制限する
投稿や固定ページのリビジョン数を制限することで、古いリビジョンの蓄積を回避することができます。サイトのコンテンツを頻繁に更新するストアでは、リビジョンの量が手に負えなくなってしまうのを防ぐのに便利です。
簡単な設定方法は、以下のコードスニペットをwp-config.phpファイルに加えること。ABSPATH
が定義されている行の前に貼り付けてください。
define('WP_POST_REVISIONS', 15);
上のコードは、リビジョンの上限を15件に設定する例です。リビジョン数は任意の数に変更可能ですが、15以下が望ましいです。
WP Revisions Controlのような無料のプラグインを使用する方法もあります。
リビジョンを完全に無効にする(不要な場合)
そもそもリビジョン機能が不要であれば、無効化してしまうこともできます。以下のコードをwp-config.phpファイルに追加しましょう。先ほどと同様、ABSPATH
が定義されている行の上に貼り付けてください。
define('WP_POST_REVISIONS', false);
これも、Disable Post Revisionのような無料のプラグインで設定可能です。
リビジョンを無効にする前には、データベースから完全にリビジョンを取り除くため、現在残っているリビジョンをすべて削除することをおすすめします。
期限切れのTransientを削除する
Transientとは、独自の名前で一時的に保存されているキャッシュデータで、通常WordPressデータベースのwp_options
テーブルの下に保存されています。
TransientsはOptionsと似ていますが、有効期限があるのが特徴です。リモートAPIからのレスポンスや大量のクエリなど、一時的なデータを保存するのに有用です。
WordPressのTransients APIでは、Transientsの扱い方、期限切れのTransientsの自動削除などを定義していますが、時には設定通りに機能しないことも。
破損したTransientが100万件近い不要なエントリを生成することがあります。また、ユーザーセッションは、時間の経過とともに蓄積され、データベースのテーブルに何千もの行を生み出します。これによって、データベースが肥大化し、最悪の場合はサイトの破損につながります。
無料のDelete Expired Transientsプラグインを使えば、期限切れのTransientを簡単に削除することができます。
データベーステーブルを削除する
WooCommerceのデータベースには、ECストアの運営に必要なデータがすべて格納されています。データを追加、削除したり、テーブルを移動したりすると、データベースの効率が落ち、重要でないデータも多く保存されることに。
そのため、データベースのテーブルを削除し、不要なデータを一掃しなければなりません。特にwp_options
テーブルは肥大化しやすく、データベースのパフォーマンス低下の原因になります。
データベースの整理は、WordPressサイトをスムーズに運営し続けるのに不可欠な作業です。
とは言え、手作業で最適化していくのは気の遠くなる作業。無料のWP-Optimizeプラグインを使用すると、不要なデータが保存されているテーブルを検出し、無駄なスペースを削除することができます。また、データの断片化によって失われたストレージ容量も取り戻せます。
WP-Optimizeをスケジュールし、定期的にデータベースをクリーンアップしましょう。
データベースに負担をかけている不要な機能を無効にする
魅力的で優れた機能を持つWooCommerceのテーマやプラグインは多数ありますが、将来的にデータベースを破損してしまうこともあります。
例えば、人気商品や関連商品プラグイン。特に商品点数が多いストアでは、サイト全体に膨大な量のクエリをもたらす可能性があります。このような機能を実装する場合は、自分でページに挿入することをおすすめします。これには、Advanced Custom Fieldsのようなプラグインが一役買ってくれます。
もう一つの例は、外部ではなくサイトがホストされている同じサーバー上で画像を圧縮する画像最適化プラグイン。このようなプラグインは、サーバーのリソースを大量消費します。
また、サイトにカウンターを追加するプラグインの使用は避けましょう。これは例えば、ユーザー名の横に閲覧数や投稿数、コメント数を追加する機能です。このような数字の計算はデータベースに大きな負荷を与えます。
ソーシャルカウンター(SNSでのシェア数やいいね!の数のカウンター)も同様です。データベースのパフォーマンスを最大化するため、このような自動生成カウンターの設置は必要最低限にしましょう。
WordPressデータベースの調整は、例えるなら家事のように継続的な作業です。
これを念頭に置き、Kinstaではデータベースパフォーマンスの問題に対処する自動化システムを実装しています。サイトの要件に基づいて、システムがMySQLデータベースを継続的にスキャンしながら微調整し、データベースのパフォーマンスを最高な状態に保ちます。自動的に修正できない問題が検出された場合は、Kinstaのシステム管理チームに通知が送信され、担当者がすぐに問題解決にあたります。
Kinsta以外のホスティングサービスを利用している場合は、追加のツールが必要になります。作業を効率化できる以下のようなプラグインがおすすめです。
なお、データベースやWordPressのコアファイルを編集する際、始める前に必ずバックアップを作成することをお忘れなく。
12. モバイルファーストを考慮する
2022年には、世界のインターネットユーザー数は53億人に達しました。これは世界人口の約66%がインターネットを利用していることを意味します。
2019年の世界のサイトトラフィックでは、モバイル端末がPCを追い抜き、総ページビューの52.6%を占めています。また、インドやナイジェリアなど一部の国では、モバイル端末からのウェブページビューの70%を超えています。
Statistaの調べによると、世界中のECサイト利用者のほとんどは、モバイル端末からアクセスしており、注文数も最も多いことがわかっています。2022年最終四半期の時点で、スマートフォンは世界中の小売サイトのトラフィックの約74%を占め、オンラインストアの63%の収益を生み出しています。
驚くべきことに、モバイル端末のコンバージョン率はPCの半分以上。近年のスマートフォンとタブレットの発展により、この数字は今後も飛躍的に伸びていくことが予想されます。
また、モバイル端末での商品の購入しやすさも重要です。
スピードは重要。スマートフォンユーザーの58%は、モバイルサイトやアプリで素早く購入可能な会社から商品を購入している
したがって、WooCommerceストアをモバイル向けに最適化することも重要です。まずは、Googleのモバイル フレンドリー テストやChromeのLighthouseを使って、現在のストアがモバイルユーザビリティの最低基準を満たしているかどうかをチェックすることから始めましょう。
モバイル フレンドリー テストツールを使用すると、サイトがモバイル端末でどのように表示されるかのスナップショットを確認することができます。モバイルユーザビリティに問題が見られる場合は、それも一覧表示されます。
WordPressサイトをモバイルフレンドリーにする最も簡単な方法は、レスポンシブテーマを使用すること。この記事でご紹介したテーマは、すべてレスポンシブ対応で、モバイル端末でも美しく表示されます。
モバイル端末で買い物するユーザーは、延々とスクロールすることを好みません。したがって、ショップページはできるだけシンプルに保ちましょう。コンテンツの詰め込み過ぎに注意です。
たくさんの商品を抱えている場合は、買い物客がお目当ての商品を検索しやすいようにしてください。WooCommerceストアの商品検索には、WooCommerce Product Searchプラグインがおすすめです。
最後に、買い物客の決済体験も最適化しましょう。注文完了までのステップを少なく抑えることで、ユーザーが買い物しやすくなります。これには、以下のようなWooCommerceの拡張機能がおすすめです。
- WooCommerce Social Login:手間のかかるアカウント作成やログイン作業をなくし、Facebook、Twitter、Googleなどのアカウントを使ってログインできるように。
- Variation Swatches and Photos:商品バリエーションを選択するための煩わしいドロップダウンメニューを排除し、すべての商品を簡単にタップできるボタンを作成。
- One Page Checkout:ユーザーがストアを離脱せずにすぐに欲しい商品を購入できるよう、アカウント登録不要のゲストチェックアウトを設定。
- Checkout Field Editor:決済ページのフィールドを追加、削除、変更(例えば、デジタル商品のみを販売する場合には、配送先住所は不要)。
- Bolt、Stripe、Amazon Pay、PayPal:決済システムは、モバイルショッピングの悩みの種。WooCommerce支払いゲートウェイ拡張機能で、支払いの受け取りが容易に。
結局のところ、モバイルショッピングとは、単にユーザーが買い物をするだけではありません。多くの人が商品情報を調べたり、価格を調べたり比較したりするために利用しています。モバイル端末でのユーザー体験もより良いものを提供することが重要です。
13. AJAXリクエストget_refreshed_fragmentsを無効にする
WooCommerceでは、ユーザーがショッピングカートに変更を加えると、AJAXリクエストのget_refreshed_fragmentsを使って、ショッピングカートの内容が動的に更新されます。再読み込みすることなく、カートの内容を更新できることは、ユーザーエクスペリエンスの観点からは素晴らしいことです。
しかしこれによって、ほとんどの場合、主に共用サーバーでホストされているサイトの速度は低下します。また、多くのサイトで実際にこの機能を使用することはありません。
これを検証するため、最新のWooCommerceストアをPingdomでテストしてみました。
たった1.1KBのサイズにもかかわらず、wc-ajax=get_refreshed_fragments
リクエストは、たった1.1KBにもかかわらず、実行するのに0.76秒もかかっていることがわかります。サイトの表示速度が3秒以下だとすると、ページの読み込み時間の25%以上を占めています。このテストサイトは、クラウドVPS(仮想専用サーバー)で稼働しています。これが安価なサーバーであれば、表示速度がさらに大幅に遅くなることは想像に容易いでしょう。
この問題に関しては、WebNotsによるブログ記事が参考になります。無料のDisable Cart Fragments、またはDisable Cart Fragments by Optimochaプラグインを使用すれば、この負荷のかかるリクエストを無効にすることができます。
無効にしたら、管理画面で「WooCommerce」>「設定」に移動し、「商品」タブの「追加後、お買い物カゴのページにリダイレクト」にチェックを入れることをおすすめします。
これによって、商品をカートに追加すると、買い物カゴ画面にリダイレクトされるようになります。
WooCommerceの管理画面を最適化する方法
スピードはフロントエンドだけに求められる要素ではありません。ストアを簡単に管理し、必要な時にいつでもすぐに変更を加えるには、バックエンドの速度も重要です。
WooCommerce管理画面での作業が効率化されれば、全体の生産性を高めることができます。削減できた時間は、オンラインマーケティングなどのWooCommerceストアの成功に欠かせない大切な業務に充てましょう。
ここからは、WooCommerceの管理画面を高速化する方法を見ていきます。
まずはフロントエンドを最適化
速度の低下がWordPressの管理画面だけでなく、サイト全体で見られる場合は、まずは上でご紹介した最適化のヒントをすべて実践してみてください。
というのもほとんどの場合、WooCommerceストアのフロントエンドを高速化すると、サーバーのリソースが解放され、必然的にバックエンドも最適化されます。
Kinstaでは、自己修復PHPシステムと継続的なデータベース監視により、サーバー側でサイトが常に最適化されます。
フロントエンドを最適化しても、管理画面が重たい場合には、以下のヒントを参考にしてみてください。
14. 無駄なものを取り除き、定期的に更新する
まず、WordPress、WooCommerce、プラグイン、拡張機能、テーマは頻繁に更新すること。使用しているテーマやプラグインのサポートが終了している場合には、他のテーマやプラグインに切り替えることを検討してみてください。
同様に、テーマやプラグインが管理画面に不必要なデータを生み出している場合は、他の優れた代替品に目を向けてください。例えば、管理画面に目立つ広告を表示するプラグインは、手放すことをお勧めします。
この問題は極めて一般的で、人気WordPressプラグインから無駄なデータを排除することだけに特化したプラグインが存在するほど。
15. オブジェクトキャッシュとデータベースキャッシュを無効にする
キャッシュプラグインは、WordPressサイトを高速化する画期的なツールです。しかし、適切に設定されていなければ、パフォーマンスに悪影響を与えることも。これにはバックエンドの速度低下も含まれます。
W3 Total Cacheは人気の高いキャッシュプラグインの1つ。さまざまなキャッシュ設定を無料で利用できます。JSとCSSの圧縮機能やCDN統合もあり、100万件以上のウェブサイトで使用されています。
W3 Total Cacheには、以下のキャッシュ設定があります。
- ページキャッシュ
- OPcache
- データベースキャッシュ
- オブジェクトキャッシュ
- ブラウザキャッシュ
- フラグメントキャッシュ
これほどの種類があると、それぞれの違いを理解していない場合は、やや使いづらいかもしれません。
オブジェクトキャッシングとデータベースキャッシングは、データベースクエリの回数を減らすことで、サイトを高速化しますが、その代償としてサーバーのメモリを消費することに。
Kinstaのようなスマートで高性能なホスティングサーバーを利用している場合、サーバーレベルのキャッシュがすでに導入されているため、キャッシュに関する心配や、費用対効果の高いキャッシングプラグインを探す必要はありません。
しかし、すべてのホスティングサービスにここまでのキャッシュ機能があるわけではありません。
その場合は、W3 Total Cacheのようなサードパーティのキャッシュプラグインを使用しましょう。W3 Total Cacheはシンプルなプラグインで、ワンクリックで様々なキャッシュを有効にすることができます。
「W3 Total Cache」>「General Settings」に移動し、オブジェクトキャッシュとデータベースキャッシュの両方を無効にしましょう(「Enable」のチェックを外す)。その後、管理画面の動作が改善されるかどうかを確認してください。
キャッシュの設定は、プラグインの設定ボックスにチェックを入れたり、外したりするほど単純ではありません。変更を加えて古いキャッシュを削除した後は、サイトが正しく動作しているかも確認してください。
16. リソース消費量の多いプラグインを削除する
Kinstaでは、脆弱性やセキュリティ問題を検出するため、インストールされたすべてのプラグインの自動セキュリティチェックが行われます。万が一サイトで問題が発生した場合も、セキュリティ保持誓約により、Kinstaのエンジニアが無料で対処します。
WordPressプラグインの中には、ウェブサーバーのリソース、CPUとRAMの大半を消費するものがあります。
無料のQuery Monitorプラグインで、このような問題のあるプラグインを特定することができます。サイトが読み込んでいるすべてのスクリプト、スタイル、HTTP API呼び出しが、サイズと読み込み時間とともに表示されます。リクエスト数が最も多く、読み込み時間が最も遅いものを見つけましょう。
以下のテストサイトでは、Classic Editorプラグインの読み込みが最も遅いことがわかります。また、その他のプラグイン、Loginizerや WP Bakery(旧Visual Composer)も潜在的な懸念がありそうです。
上のスクリーンショットから、移行プラグインとClassic Editorプラグインが不要であることがわかり、削除すると、管理画面の速度が大幅に改善されました。
国内に留まらず海外のユーザーもターゲットにするWooCommerceストアであれば、複数の言語でサイトを提供するため、WPMLのような翻訳プラグインを使用しているでしょう。WPMLはさまざまな便利機能を持つ優れたプラグインですが、管理画面の速度を著しく低下させます。
Polylangのような無駄にリソースを消費しない翻訳プラグインに切り替えることで、パフォーマンスを改善することができます。WPMLと比べればその機能性は劣りますが、大体はこれでうまく機能します。
進行中の処理やスキャンが多いプラグインもまた、バックエンドのパフォーマンスを低下させます。例えば、サイトマップジェネレータ、分析グラフやチャート、ページビルダー、チャットプラグインなど。
17. WordPress向けにCDNを設定する
CDNは、世界中のユーザーにWooCommerceストアを高速配信するのに役立ちます。これは、サイトのリソースのスナップショットを保存し、ユーザーに最も近いサーバーから配信することで実現されます。
Kinstaをご利用の場合は、Cloudflare提供のCDNがすべてのプランで自動的に処理されるため、CDNのセットアップは一切不要。サイトの立ち上げ作業を効率化することができます。
CDNでは通常、WordPressバックエンドのキャッシュがデフォルトで無効になります。しかし、そうでないCDNもあり、管理画面の動作が極端に重くなることがあります。その場合は、CDNのキャッシュから管理画面を除外し、パフォーマンスを改善する必要があります。
これを行う1つの方法は、Cloudflareを使用すること(Kinstaを利用していない場合)。WordPressの管理画面から、以下の手順で、Cloudflareの機能を無効にするページルールを設定することができます。
- Cloudflare管理画面の「ページ」>「ページ ルール」に移動します
- 「URL」フィールドに
*example.com/wp-admin/*
を貼り付けます - 「その後の設定は」の「キャッシュレベル」を「バイパス」に設定します
- 任意で「パフォーマンスを無効にする」や「セキュリティを無効にする」も設定可能です(非推奨)
- 「保存してデプロイする」をクリックします
保存後、設定が有効になるまで3分ほどかかります。
KeyCDNを使用している場合は、同社のWordPress Cache Enablerを使用してください。その他のCDNについては、サポートに問い合わせてみてください。
18. WordPress Heartbeat APIを効率化する
WordPress Heartbeat APIは、ブラウザとサーバー間の定期的な接続を維持することで、ほぼリアルタイムの更新を可能にします。15~60秒ごとにサーバーにリクエストを送信し、データを受信するとイベント(またはコールバック)をトリガーします。
これには、投稿の自動保存、投稿のロック、ログイン期限切れ警告など、さまざまな優れた機能がありますが、毎分数回のリクエストをサーバーに送信すると、管理画面の動作が遅くなる可能性があります。
WP Rocketの無料Heartbeat Controlプラグインを使用すると、管理画面、フロントエンド、投稿エディターでこのAPIリクエストの頻度を変更することができます。また、APIを完全に無効にすることも可能です。
WP Rocketでは、管理画面、フロントエンド、投稿エディター上でこれらのAPIリクエストの頻度を変更することができます。APIを完全に無効にする設定もあります。
まずは頻度を低くすることから始めましょう。それでも効果が見られない場合は、APIを無効にすることを検討してみてください。
ここまでご紹介してきた最適化のヒントをすべて実践しても、WooCommerceストアがいまひとつ高速化されない場合は、利用しているホスティングサービスを見直してみてください。最後に、ホスティングの種類とWooCommerceストア向けの適切なホスティング選びについてご説明します。
マネージド vs 非マネージドWordPressホスティング
WordPressホスティングは、大きくマネージドと非マネージド(アンマネージドとも)の2つに分けられます。前者は、ホスティング会社がWordPressのサーバー周りのすべての設定を担当し、ほぼすべてのユーザーに推奨されます。後者は、自分でサーバーを調整、管理できる専門知識を持つ開発者などに適しています。
WooCommerceストアの場合は、Kinstaなどが提供する質の高いWooCommerceストア向けマネージドホスティングを選ぶのが賢明です。マネージドホスティングは、非マネージドよりも高価になる傾向にありますが、価格に見合ったサービスや機能を手にすることができます。
マネージドホスティングには、主に4つのタイプがあります。それぞれに長所と短所があるため、予算と要件に合ったものを見極めて選択してください。
上記で提示した要件を考慮すれば、共用ホスティング(左上)は、除外して問題ないでしょう。
仮想専用サーバー(VPS)は、共用ホスティングと似ており、共用サーバーの中に専用の仮想スペースを確保することができます。予算に限りがある場合は、中規模なVPSホスティングを選ぶのも手です。しかし、サイトのトラフィックが多い場合には、すぐにアップグレードが必要になります。
残すは、クラウドホスティングと専用サーバー。要件によっては、どちらもWooCommerceサイトに適しています。
専用サーバープランの価格は、クラウドホスティングプランに比べると高額で、月額50ドルから数千ドルと幅があります。
一方、KinstaのWordPress専用マネージドホスティングは、推奨されるWooCommerceの要件をすべて満たし、プレミアムティアネットワークとC2およびC3DマシンでGoogle Cloud Platform上に構築された専用リソースと、フルマネージドホスティングをすべてのお客様に提供しています。コンテナ技術によって、サイトリソースをコンテナ化し、サイト単位でパフォーマンスレベルを向上させる独自のインフラは、WooCommerceストアに理想的です。加えて、ファイアウォールやバックアップ、優れたカスタマーサポートも付帯しており、高い稼働率と信頼性を保証します。機能をさらに拡張したい場合には、Redis、バックアップアドオン、リバースプロキシなどのアドオンも購入可能です。
以下は、Kinstaが使用するGCPの次世代コンピューティング最適化仮想マシン(C2)に移行した、あるECサイトのパフォーマンスの変化を表すグラフです。
665ミリ秒から500ミリ秒まで、25%もパフォーマンスが向上しています。Kinstaの読み込み時間は、主な競合他社と比較して39%高速です。この実績は、ECサイトのUX、SEO、ROI(投資利益率)の向上を示す導入事例によっても裏付けられています。
マーケティングに力を入れていても、サイトが低速であれば、新規見込み顧客を遠ざけてしまいかねません。高速なWordPressホスティングソリューションを選ぶ価値は十分にあります。
Kinstaの専用コントロールパネル「MyKinsta」には、データベースの検索と置換、組み込みのAPMツール、IPジオロケーションマネージャー、ionCube Loader、PHPの再起動など、数々の便利なサイト管理ツールが搭載されています。さらに、開発者や代行業者向けに、無料ローカル開発ツール「DevKinsta」も提供しています。DevKinstaでは、ローカルでプロジェクトを複製して開発し、開発を終えたら、MyKinstaに変更を反映することができます。また、WordPressのマルチサイトにも対応しています。
結局のところ、高い直帰率の原因を解き明かすのに何時間も時間を費やすよりも、質の高いホスティングサービスに毎月数ドル追加で投資する方が賢い判断と言えます。
WordPressとWooCommerceのエコシステムだけに特化したサービスを利用したいと考えており、WordPressのカスタムソリューションを生業としているNeuralabにとって、この点は本当に重要でした。つまり、WordPressのDevOpsチームのパートナーになってくれるようなホスティング会社を探していたんです。最終的に私たちが選んだのは、Kinstaでした。
Kresimir Koncic 氏|ディレクター|Neuralab(英語原文の日本語訳)
まとめ
ECサイトにとって、時は金なり。WooCommerceストアの高速化は、ユーザーエクスペリエンス、SEO、収益、ROIの向上につながります。
今回ご紹介したすべてのヒントを実践する必要はありませんが、可能な限り取り入れてみてください。サイトのボトルネックを特定するのにも役立ちます。訪問者にとって、サイトが読み込まれるのを待つほど無駄な時間はありません。今すぐWooCommerceストアを高速化しましょう!
コメントを残す