DigitalOcean Spaces CDNを使用してWordPressアセット配信を高速化する方法

前書き

WordPressサイトの静的アセットを配信するためにCDNまたは C ontent D elivery N etworkを実装すると、サーバーの帯域幅使用量を大幅に削減できるだけでなく、地理的に分散したページの読み込み時間を短縮できますユーザー。 WordPressの静的アセットには、画像、CSSスタイルシート、およびJavaScriptファイルが含まれます。世界中に分散したエッジサーバーのシステムを活用して、https：//www.digitalocean.com/community/tutorials/using-a-cdn-to-speed-up-static-content-delivery [CDN]はサイトの静的コピーをキャッシュしますネットワーク全体の資産を使用して、エンドユーザーとこの帯域幅を大量に消費するコンテンツとの距離を短縮します。

以前のソリューションガイドhttps://www.digitalocean.com/community/tutorials/how-to-store-wordpress-assets-on-digitalocean-spaces[WordPressアセットをDigitalOcean Spacesに保存する方法]で、 WordPressサイトのメディアライブラリ（画像や他のサイトコンテンツが保存される場所）から、非常に冗長なオブジェクトストレージサービスであるDigitalOcean Spacesへ。これはhttps://wordpress.org/plugins/do-spaces-sync/[DigitalOcean Spaces Syncプラグイン]を使用して行いました。WordPressのアップロードをSpaceに自動的に同期し、サーバーからこれらのファイルを削除してディスクを解放しますスペース。

このhttps://www.digitalocean.com/community/tags/solutions?type=tutorials [ソリューション]ガイドでは、Spaces CDNを有効にしてメディアライブラリのアセットURLを書き換えることにより、この手順を拡張します。これにより、ユーザーのブラウザは、静的コンテンツを配信するために最適化された地理的に分散したキャッシュサーバーのセットであるCDNから静的アセットを直接ダウンロードするようになります。 SpacesのCDNを有効にする方法、CDNからWordPressアセットを提供するリンクを書き換える方法、そしてWebサイトのアセットがCDNによって正しく配信されることをテストする方法について説明します。

無料でオープンソースのSpaces Syncプラグインを使用して、メディアライブラリのオフロードとリンクの書き換えを実装する方法を示します。また、2つの一般的な有料WordPressプラグインを使用してこれを行う方法についても説明します。* https：//deliciousbrains.com/wp-offload-s3/ [WP Offload Media] および https：//maxgalleria.com/downloads/media -library-plus-pro / [Media Library Folders Pro] *。制作ニーズに最適なプラグインを選択する必要があります。

前提条件

このチュートリアルを開始する前に、LAMPまたはLEMPスタックの上に実行中のWordPressインストールが必要です。また、WordPressサーバーにhttp://wp-cli.org/[WP-CLI]をインストールする必要があります。https：//www.digitalocean.com/community/tutorials/how- to-up-up-up-wordpress-site-to-spaces＃using-plugins-to-create-backups [これらの指示]。

メディアライブラリをオフロードするには、DigitalOcean Spaceとアクセスキーペアが必要です。

Spaceの作成方法については、https：//www.digitalocean.com/docs/spaces/how-to/create-and-delete [Spaces製品ドキュメント]をご覧ください。
オープンソースの `+ s3cmd +`ツールを使用してアクセスキーペアを作成し、スペースにファイルをアップロードする方法については、https：//www.digitalocean.com/docs/spaces/resources/s3cmd/ [s3cmd 2.x Setupを参照してください。 ]、DigitalOcean製品ドキュメントサイトにもあります。

WordPressアセットをオフロードするために使用できるWordPressプラグインがいくつかあります。

* https：//wordpress.org/plugins/do-spaces-sync/ [DigitalOcean Spaces Sync] *は、Media LibraryをDigitalOcean Spaceにオフロードするための無料のオープンソースWordPressプラグインです。これを行う方法は、https：//www.digitalocean.com/community/tutorials/how-to-store-wordpress-assets-on-digitalocean-spaces [WordPressアセットをDigitalOcean Spacesに保存する方法]で学習できます。
* https：//deliciousbrains.com/wp-offload-media/ [WP Offload Media] *は、WordPressメディアライブラリからDigitalOcean Spacesにファイルをコピーし、CDNからファイルを提供するためにURLを書き換える有料プラグインです。 Assets Pullアドオンを使用すると、サイト（WordPressテーマなど）で使用されるアセット（CSS、JS、画像など）を識別し、CDNからそれらを提供することもできます。
* https：//maxgalleria.com/downloads/media-library-plus-pro/ [Media Library Folders Pro] *は、Media Libraryアセットを整理し、DigitalOcean Spacesにオフロードするのに役立つ別の有料プラグインです。

Spaces CDNでhttps://www.digitalocean.com/docs/spaces/how-to/customize-cdn-endpoint [カスタムドメイン]を使用することを強くお勧めします。これにより、オフロードされたアセットURLをWordpressサイトのURLと同様に保つことにより、サイトの検索エンジン最適化（SEO）が大幅に改善されます。 Spaces CDNでカスタムドメインを使用するには、最初にドメインをDigitalOceanアカウントに追加する必要があります。

これを行う方法については、https：//www.digitalocean.com/docs/networking/dns/how-to/add-domains/ [ドメインを追加する方法]を参照してください。

テストの目的で、https：//www.google.com/chrome/ [Google Chrome]やhttps://www.mozilla.org/firefox[Firefox]などの最新のWebブラウザをクライアントにインストールしてください（例えばノートパソコン。

実行中のWordPressインストールがあり、DigitalOcean Spaceを作成したら、SpaceのCDNを有効にして、このガイドから始めます。

Spaces CDNを有効にする

このガイドは、DigitalOcean SpaceのCDNを有効にすることから始めます。これは、既存のオブジェクトの可用性には影響しません。 CDNを有効にすると、スペース内のオブジェクトがコンテンツ配信ネットワーク全体のエッジキャッシュに「プッシュ」され、新しいCDNエンドポイントURLが利用可能になります。 CDNの機能の詳細については、https：//www.digitalocean.com/community/tutorials/using-a-cdn-to-speed-up-static-content-delivery [CDNを使用した静的コンテンツ配信の高速化]をご覧ください。 ]。

まず、http：//digitalocean.com/docs/spaces/how-to/enable-cdn [Spaces CDNを有効にする方法]に従って、SpaceのCDNを有効にします。

Spaces CDNでカスタムドメインを使用する場合（推奨）、https：//www.digitalocean.com/docs/spaces/how-to/customize-cdn-に従ってサブドメインCNAMEレコードと適切なSSL証明書を作成しますエンドポイント[サブドメインでSpaces CDNエンドポイントをカスタマイズする方法]。 WordPressアセットオフロードプラグインを設定するときにこれを使用する必要があるため、Spaces CDNで使用するサブドメインを書き留めます。

スペースに戻り、ページをリロードします。 Space名の下に新しい* Endpoints *リンクが表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/endpoints_link.png [エンドポイントリンク]

これらのエンドポイントには、スペース名が含まれています。このチュートリアルでは「++」を使用しています。

新しい* Edge エンドポイントが追加されていることに注意してください。このエンドポイントは、CDNを介してSpacesオブジェクトのリクエストをルーティングし、可能な限りエッジキャッシュからそれらを処理します。この Edge エンドポイントをメモします。これは、将来の手順でWordPressプラグインを設定するために使用します。 Spaces CDNのサブドメインを作成した場合、このサブドメインは Edge *エンドポイントのエイリアスです。

SpaceのCDNを有効にしたので、アセットオフロードとリンク書き換えプラグインの設定を開始する準備ができました。

DigitalOcean Spaces Syncを使用していて、https：//www.digitalocean.com/community/tutorials/how-to-store-wordpress-assets-on-digitalocean-spaces [WordPressアセットをDigitalOcean Spacesに保存する方法]から継続している場合、次のセクションから読み始めます。 Spaces Syncを使用していない場合は、https：//www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery-using-digitalocean-spaces-cdn#wordpressのいずれかにスキップしてください。 -offload-media-plugin [WP Offload Mediaセクション]またはhttps://www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery-using-digitalocean-spaces-cdn# media-library-folders-pro-and-cdn-enabler-plugins [Media Library Folders Proセクション]、使用するプラグインに応じて。

Spaces Syncプラグイン

無料でオープンソースのDigitalOcean Spaces SyncおよびCDN Enablerプラグインを使用して、CDNのエッジキャッシュからファイルを提供する場合は、このセクションで概説する手順に従ってください。

まず、WordPressのインストールとSpaces Syncプラグインが正しく構成され、DigitalOcean Spacesのアセットを提供していることを確認します。

Spaces Syncプラグイン構成の変更

WordPressアセットをDigitalOcean Spacesに保存する方法から続けて、 Media LibraryはDigitalOcean Spaceにオフロードされ、Spaces Syncプラグインの設定は次のようになります。

image：https：//assets.digitalocean.com/articles/do_spaces_sync_plugin/sync_cloud_only.png [同期クラウドのみ]

WordPressアセットの保存方法を完了していない場合DigitalOcean Spaces]チュートリアルでは、https：//codex.wordpress.org/Managing_Plugins#Installing_Plugins [ビルトインプラグインインストーラー]を使用してSpaces Syncプラグインをインストールすることにより、このガイドに従うことができます。エラーが発生した場合は、この前提条件ガイドの手順を参照してください。

設定により、「+ wp-content / uploads +」メディアライブラリーフォルダー以外のWordPressテーマや他のディレクトリをオフロードできるように、若干の変更を加えます。

最初に、*ファイルへの完全なURLパス*フィールドを変更して、サーバーからローカルではなく、スペースのCDNからメディアライブラリファイルが提供されるようにします。この設定は、基本的にメディアライブラリアセットへのリンクを書き換え、WordPressサーバーでローカルにホストされるファイルリンクからDigitalOcean Spaces CDNでホストされるファイルリンクに変更します。

https://www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery-using-digitalocean-spaces-cdn#enabling-spacesで書き留めた* Edge *エンドポイントを思い出してください-cdn [スペースCDNの有効化]ステップ。 Spaces CDNでカスタムサブドメインを使用している場合、Edgeエンドポイントの代わりにそのサブドメインを使用します。

このチュートリアルでは、スペースの名前は「++」であり、スペースのCDNエンドポイントは次のとおりです。

https://..cdn.digitaloceanspaces.com

次に、Spaces Syncプラグインの設定ページで、[* URLへの完全なパス]フィールドのURLをSpaces CDNエンドポイントに置き換え、その後に `+ / wp-content / uploads +`を追加します。

このチュートリアルでは、上記のSpaces CDNエンドポイントを使用して、完全なURLは次のようになります。

https://..cdn.digitaloceanspaces.com/wp-content/uploads

カスタムサブドメイン、たとえば「+ https：// +」を使用している場合、完全なURLは次のようになります。

https:///wp-content/uploads

次に、*ローカルパス*フィールドに、WordPressサーバーの `+ wp-content / uploads `ディレクトリへのフルパスを入力します。このチュートリアルでは、サーバー上のWordPressインストールへのパスは「 / var / www // 」であるため、「 uploads 」へのフルパスは「 / var / www // wp-content / uploads +」になります。。

Storage prefix *フィールドに、 `+ / wp-content / uploads `を入力します。これにより、他のWordPressディレクトリをオフロードできるように、正しい ` wp-content +`ディレクトリ階層を構築します。スペース。

*ファイルマスク*は、特定のファイルを除外しない限り、「+ * +」でワイルドカードのままにすることができます。

*ファイルをクラウドにのみ保存して削除… *オプションをチェックする必要はありません。 DigitalOcean Spaceに正常にアップロードされた後にメディアライブラリアセットをサーバーから削除する場合にのみ、このボックスをオンにします。

最終的な設定は次のようになります。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/modified_sync_settings.png [最終スペース同期設定]

上記の値を、WordPressのインストールとSpacesの設定に対応する値に置き換えてください。

最後に、* Save Changes *を押します。

Spaces Syncプラグインの設定が正常に更新されたことを確認する* Settings saved *ボックスが画面の上部に表示されるはずです。

今後 WordPress Media LibraryのアップロードはDigitalOcean Spaceに同期され、Spaces Content Delivery Networkを使用して配信されるようになります。

このステップでは、WordPressテーマまたはその他の「+ wp-content +」アセットをオフロードしませんでした。これらのアセットをSpacesに転送し、Spaces CDNを使用して提供する方法については、https：//www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery-using-digitaloceanにスキップしてください。 -spaces-cdn＃offloading-additional-assets-（オプション）[追加資産のオフロード]。

メディアライブラリのアップロードがSpaces CDNから配信されていることを確認およびテストするには、https：//www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery-using-digitaloceanにスキップします-spaces-cdn＃testing-cdn-caching [CDNキャッシングのテスト]。

WordPressオフロードメディアプラグイン

DeliciousBrains WordPress Offload Media pluginを使用すると、Media LibraryアセットをDigitalOcean Spacesに迅速かつ自動的にアップロードし、これらのアセットへのリンクを書き換えて、直接配信できます。 SpacesまたはSpaces CDN経由。さらに、https：//deliciousbrains.com/wp-offload-media/doc/assets-pull-addon/ [アセットプルアドオン]を使用すると、JS、CSS、フォントファイルなどの追加のWordPressアセットを、 pull CDN。このアドオンのセットアップはこのガイドの範囲外ですが、詳細についてはhttps://deliciousbrains.com/wp-offload-media/doc/assets-pull-addon/[DeliciousBrains documentation]をご覧ください。

まず、サンプルのWordPressサイト用にWP Offload Mediaプラグインをインストールして構成します。

WP Offload Mediaプラグインのインストール

まず、DeliciousBrains https://deliciousbrains.com/wp-offload-media/pricing/ [プラグインサイト]でプラグインのコピーを購入する必要があります。メディアライブラリ内のアセットの数、およびサイトのサポートと機能の要件に応じて適切なバージョンを選択します。

チェックアウトを完了すると、プラグインのダウンロードリンクとライセンスキーが記載された購入後のサイトに移動します。ダウンロードリンクとライセンスキーも、プラグインの購入時に指定したメールアドレスに送信されます。

プラグインをダウンロードして、WordPressサイトの管理インターフェイス（ + https：/// wp-admin +）に移動します。必要に応じてログインします。ここから、*プラグイン*にカーソルを合わせ、*新規追加*をクリックします。

[*プラグインのアップロード]をクリックし、ページの上部にある[ファイルの選択]をクリックして、ダウンロードしたzipアーカイブを選択します。

[今すぐインストール]をクリックしてから、[プラグインのアクティブ化]をクリックします。 WordPressのプラグイン管理インターフェースが表示されます。

ここから、プラグイン名の下にある[設定]をクリックして、WPオフロードメディアプラグインの設定ページに移動します。

次の画面が表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/wp_offload_storage_provider.png [WP Offload Media Configuration]

DigitalOcean Spaces *の横にあるラジオボタンをクリックします。 Spacesアクセスキーを `+ wp-config.php +`ファイルで設定するか（推奨）、Webインターフェースで直接設定するよう求められます（後者はWordPressデータベースにSpaces資格情報を保存します）。

Spacesアクセスキーを `+ wp-config.php`で設定します。

コマンドラインからWordPressサーバーにログインし、WordPressルートディレクトリに移動します（このチュートリアルでは、これは `+ / var / www / html `です）。ここから、お気に入りのエディターで ` wp-config.php +`を開きます：

sudo nano wp-config.php

「+ / *」という行までスクロールして、編集を停止します！幸せなブログ。 * / + `、およびスペースアクセスキーペアを含む次の行を挿入する前に（アクセスキーペアの生成方法については、https：//www.digitalocean.com/docs/spaces/how-to/administrativeを参照してください。 -access /＃access-keys [Spaces製品ドキュメント]）：

wp-config.php

. . .
define( 'AS3CF_SETTINGS', serialize( array(
   'provider' => 'do',
   'access-key-id' => '',
   'secret-access-key' => '',
) ) );

/* That's all, stop editing! Happy blogging. */
. . .

編集が完了したら、ファイルを保存して閉じます。変更はすぐに有効になります。

WordPress Offload Mediaプラグイン管理インターフェイスに戻り、* wp-config.phpでアクセスキーを定義*の隣のラジオボタンを選択し、* Save Changes *を押します。

次のインターフェイスが表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/wp_offload_bucket_selection.png [WPオフロードバケット選択]

この設定ページで、* Region ドロップダウンを使用してスペースに適切な領域を選択し、 Bucket *の隣にスペース名を入力します（このチュートリアルでは、スペースは `+ wordpress-offload +`と呼ばれます）。

次に、*バケットを保存*を押します。

メインのWPオフロードメディア設定ページが表示されます。上部に次の警告ボックスが表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/wp_offload_license.png [WP Offload License]

[ライセンスキーを入力]をクリックし、次のページで、電子メールの領収書またはチェックアウトページにあるライセンスキーを入力し、[ライセンスのアクティブ化]をクリックします。

ライセンスキーを正しく入力すると、* License activation successfully *が表示されます。

次に、ウィンドウ上部の[メディアライブラリ]をクリックして、WPオフロードメディアのメイン構成ページに戻ります。

この時点で、WP Offload Mediaは、DigitalOcean Spaceで使用するために正常に構成されています。 Spaces CDNを使用して、アセットのオフロードと配信を開始できるようになりました。

WPオフロードメディアの構成

WP Offload MediaをDigitalOcean Spaceにリンクしたので、Spaces CDNからメディアを配信するためのアセットのオフロードとURL書き換えの構成を開始できます。

メインのWPオフロードメディア構成ページに次の構成オプションが表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/wp_offload_main_nav.png [WP Offload Main Nav]

これらのデフォルトは、ほとんどのユースケースで正常に機能するはずです。メディアライブラリがWordPressディレクトリ内の非標準パスに存在する場合、*パス*オプションの下のテキストボックスにパスを入力します。

WordPressサーバーではなくSpacesから直接提供されるようにアセットURLを変更する場合は、[メディアURLの書き換え]の横にある[オン]に切り替えてください。

Spaces CDNを使用してMedia Libraryアセットを配信するには、SpacesのCDNが有効になっていることを確認してください（https://www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery- using-digitalocean-spaces-cdn＃enabling-spaces-cdn [Spaces CDNを有効にする方法]で学習し、* Edge *エンドポイントのURLを書き留めます。 * Custom Domain（CNAME）*の横のトグルを押して、表示されるテキストボックスに、接頭辞「+ https：// +」なしでCDN * Edge *エンドポイントURLを入力します。

このガイドでは、Spaces CDNエンドポイントは次のとおりです。

https://.nyc3.cdn.digitaloceanspaces.com

ここに入力します：

.nyc3.cdn.digitaloceanspaces.com

Spaces CDNでカスタムサブドメインを使用している場合、ここにそのサブドメインを入力します。

.example.com

セキュリティを向上させるために、トグルを*オン*に設定することにより、メディアライブラリアセット（CDNを使用して提供される）へのリクエストに対してHTTPSを強制します。

オプションで、WordPressサーバーからSpacesにオフロードされたファイルを消去して、ディスク容量を解放できます。これを行うには、[サーバーからファイルを削除]の横にある[オン]を押します。

WPオフロードメディアの構成が完了したら、ページの下部にある[変更を保存]をクリックして設定を保存します。

URLプレビュー*ボックスには、Spaces CDNエンドポイントを含むURLが表示されます。次のようになります。

+ https：//。nyc3.cdn.digitaloceanspaces.com / wp‑content / uploads / 2018/09/21211354 / photo.jpg +

Spaces CDNでカスタムサブドメインを使用している場合、URLプレビューにはこのサブドメインが含まれている必要があります。

このURLは、Spaces CDNを使用してメディアライブラリアセットを配信するようにWPオフロードメディアが正常に構成されたことを示します。パスに「+ cdn +」が含まれていない場合は、* Edge *エンドポイントURLと_not_ * Origin * URLを正しく入力したことを確認してください（カスタムサブドメインを使用する場合は適用されません）。

この時点で、Spaces CDNを使用してメディアライブラリを配信するようにWPオフロードメディアが設定されました。メディアライブラリへの*未来*のアップロードは、DigitalOcean Spaceに自動的にコピーされ、CDNを使用して提供されます。

組み込みのアップロードツールを使用して、メディアライブラリ内の既存のアセットを一括でオフロードできるようになりました。

メディアライブラリのオフロード

プラグインに組み込まれている「アップロードツール」を使用して、WordPressメディアライブラリ内の既存のファイルをオフロードします。

メインのWPオフロードメディア構成ページの右側に、次のボックスが表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/wp_offload_upload_tool.png [WP Offload Upload Tool]

[今すぐオフロード]をクリックして、メディアライブラリファイルをDigitalOcean Spaceにアップロードします。

アップロード手順が中断されると、ボックスが次のように変わります。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/wp_offload_upload_tool_2.png [WP Offload Upload Tool 2]

Offload Remaining Now *を押して、残りのファイルをDigitalOcean Spaceに転送します。

メディアライブラリから残りのアイテムをオフロードすると、次の新しいボックスが表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/wp_offload_success.png [WP Offload Success]

この時点で、メディアライブラリをSpaceにオフロードし、Spaces CDNを使用してユーザーにファイルを配信しています。

いつでも、* Download Files *を押すと、SpaceからWordPressサーバーにファイルをダウンロードできます。

*ファイルの削除*を押すと、DigitalOcean Spaceをクリアすることもできます。これを行う前に、SpacesからWordPressサーバーにファイルをダウンロードし直してください。

このステップでは、WPオフロードメディアプラグインを使用して、WordPressメディアライブラリをDigitalOcean Spacesにオフロードし、これらのライブラリアセットへのリンクを書き換える方法を学びました。

テーマやJavaScriptファイルなどの追加のWordPressアセットをオフロードするには、https：//deliciousbrains.com/wp-offload-media/doc/assets-pull-addon/ [Asset Pull addon]を使用するか、https：// wwwを参照してください。 .digitalocean.com / community / tutorials / how-to-speed-up-wordpress-asset-delivery-using-digitalocean-spaces-cdn＃offload-additional-assets-（オプション）[このガイドの追加資産のオフロード]セクション。

Media Library Folders ProおよびCDN Enablerプラグイン

MaxGalleria Media Library Folders Pro pluginは、WordPress Media Libraryアセットをより適切に整理できる便利なWordPressプラグインです。さらに、無料のhttps://maxgalleria.com/downloads/wordpress-amazon-s3/[Spacesアドオン]を使用すると、Media LibraryアセットをDigitalOcean Spacesに一括してオフロードし、オブジェクトから直接提供するためにURLをそれらのアセットに書き換えることができます。ストレージ。その後、Spaces CDNを有効にし、Spaces CDNエンドポイントを使用して、分散配信ネットワークからライブラリ資産を提供できます。この最後の手順を実行するには、https：//wordpress.org/plugins/cdn-enabler/ [CDN Enabler]プラグインを使用して、メディアライブラリアセットのCDNエンドポイントURLを書き換えます。

最初に、Media Library Folders Pro（MLFP）プラグインとMLFP Spacesアドオンをインストールして構成します。次に、Spaces CDNを使用してメディアライブラリアセットを配信するために、CDNイネーブラープラグインをインストールして構成します。

MLFPプラグインのインストール

MLFPプラグインを購入した後、MaxGalleriaアカウントの資格情報とプラグインのダウンロードリンクが記載されたメールを受け取っているはずです。プラグインのダウンロードリンクをクリックして、MLFPプラグインのzipアーカイブをローカルコンピューターにダウンロードします。

アーカイブをダウンロードしたら、WordPressサイトの管理インターフェイス（ + https：/// wp-admin +）にログインし、左側のサイドバーで[プラグイン]に移動してから[新規追加]に移動します。

*プラグインの追加*ページから、*プラグインのアップロード*をクリックして、ダウンロードしたzipアーカイブを選択します。

[今すぐインストール]をクリックしてプラグインのインストールを完了し、[プラグインのインストール]画面から[プラグインのアクティブ化]をクリックしてMLFPをアクティブ化します。

その後、左側のサイドバーに* Media Library Folders Pro *メニュー項目が表示されます。クリックして、Media Library Folders Proインターフェイスに移動します。プラグインのさまざまな機能をカバーすることはこのガイドの範囲外ですが、詳細については、https：//maxgalleria.com/downloads/media-library-plus-pro/ [MaxGalleriaサイト]およびhttps：// maxgalleriaを参照してください。 .com / forums / [フォーラム]。

プラグインを有効にします。 MLFPメニュー項目の下の[設定]をクリックし、[ライセンスキー]テキストボックスの横にライセンスキーを入力します。 MLFPライセンスキーは、プラグインの購入時に送信されたメールに記載されています。 [変更の保存]を押してから[ライセンスのアクティブ化]を押します。次に、* Update Settings *を押します。

これでMLFPプラグインがアクティブになりました。これを使用して、WordPressサイトの既存または新しいメディアライブラリアセットを整理できます。

これらのアセットをDigitalOcean Spacesからオフロードして提供できるように、Spacesアドオンプラグインをインストールして構成します。

MLFP Spacesアドオンプラグインのインストールとメディアライブラリのオフロード

Spaces Addonをインストールするには、MaxGalleria accountにログインします。アカウントの資格情報は、MLFPプラグインを購入したときに送信されたメールで確認できます。

トップメニューバーの*アドオン*ページに移動し、メディアソース*まで下にスクロールします。ここから、 Media Library Folders Pro S3 and Spaces *オプションをクリックします。

このページから*価格*セクションまでスクロールダウンし、WordPressメディアライブラリのサイズに合ったオプションを選択します（3000画像以下のメディアライブラリの場合、アドオンは無料です）。

アドオンの「購入」を完了すると、アカウントページに戻ることができます（トップメニューバーの[アカウント]リンクをクリックして）。ここからアドオンプラグインを使用できます。

Media Library Folders Pro S3 *画像をクリックすると、プラグインのダウンロードが開始されます。

ダウンロードが完了したら、WordPress管理インターフェイスに戻り、* Upload Plugin をクリックして、上記と同じ方法を使用してダウンロードしたプラグインをインストールします。もう一度、 Activate Plugin *を押してプラグインをアクティブにします。

`+ wp-config.php`ファイルでアクセスキーを設定することについて警告を受け取る可能性があります。これらを設定します。

コンソールまたはSSHを使用してWordPressサーバーにログインし、WordPressルートディレクトリに移動します（このチュートリアルでは、これは `+ / var / www / html `です）。ここから、お気に入りのエディターで ` wp-config.php +`を開きます：

sudo nano wp-config.php

「+ / *」という行までスクロールして、編集を停止します！幸せなブログ。 * / + `、およびSpacesアクセスキーペアとプラグイン構成オプションを含む次の行を挿入する前に（アクセスキーペアの生成方法については、https：//www.digitalocean.com/docs/spaces/ how-to / administrative-access /＃access-keys [Spaces製品ドキュメント]）：

wp-config.php

. . .
define('MF_AWS_ACCESS_KEY_ID', '');
define( 'MF_AWS_SECRET_ACCESS_KEY', '');
define('MF_CLOUD_TYPE', 'do')

/* That's all, stop editing! Happy blogging. */
. . .

編集が完了したら、ファイルを保存して閉じます。

次に、https：//cloud.digitalocean.com/ [Cloud Control Panel]からDigitalOcean Spaceに移動し、* New Folder *をクリックして `+ wp-content +`というフォルダーを作成します。

ここから、WordPress管理インターフェイスに戻り、* Media Library Folders Pro をクリックしてから、サイドバーの S3＆Spaces Settings *をクリックします。

アクセスキーの設定に関する警告バナーが消えているはずです。それでも存在する場合は、タイプミスや構文エラーがないか、 `+ wp-config.php +`ファイルを再確認してください。

License Key *テキストボックスに、Spacesアドオンの購入後にメールで送信されたライセンスキーを入力します。このライセンスキーはMLFPライセンスキーとは異なることに注意してください。 [変更の保存]を押してから[ライセンスのアクティブ化]を押します。

アクティブ化されると、次の構成ペインが表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/spaces_addon_config.png [MLFP Spacesアドオン構成]

ここから、* Select Image Bucket＆Region *をクリックして、DigitalOcean Spaceを選択します。次に、スペースの正しい地域を選択し、[バケットの選択を保存]をクリックします。

これで、SpacesオフロードプラグインがDigitalOcean Spaceに正常に接続されました。 WordPressメディアライブラリアセットのオフロードを開始できます。

[クラウドサーバー上のファイルを使用する]チェックボックスを使用すると、メディアライブラリアセットの提供元を指定できます。このチェックボックスをオンにすると、アセットがDigitalOcean Spacesから提供され、画像およびその他のメディアライブラリオブジェクトへのURLがそれに応じて書き換えられます。 Spaces CDNを使用してMedia Libraryアセットを提供する予定がある場合、プラグインはCDN * Edge *エンドポイントではなくSpaces * Origin *エンドポイントを使用するため、このボックスをチェックしないでください。将来の手順でCDNリンクの書き換えを構成します。

DigitalOcean Spacesに正常にアップロードされたら、[ローカルサーバーからファイルを削除]ボックスをクリックして、ローカルメディアライブラリのアセットを削除します。

SpacesからWordPressサーバーにファイルを一括ダウンロードするときは、[クラウドサーバーからダウンロードした個々のファイルを削除する]チェックボックスを使用する必要があります。チェックした場合、これらのファイルはWordPressサーバーに正常にダウンロードされた後にSpacesから削除されます。今のところ、このオプションは無視できます。

Spaces CDNで使用するプラグインを設定しているため、[クラウドサーバー上のファイルを使用]ボックスをオフのままにして、[メディアサーバーをクラウドサーバーにコピー]をクリックして、サイトのWordPressメディアライブラリをDigitalOcean Spaceに同期します。

進行状況ボックスが表示され、メディアライブラリの同期が正常に終了したことを示す* Upload complete。*が表示されます。

DigitalOceanスペースに移動して、メディアライブラリファイルがスペースにコピーされたことを確認します。これらは、このステップで前に作成した `+ wp-content `ディレクトリの ` uploads +`サブディレクトリで利用できるはずです。

Spaceでファイルが使用可能になったら、Spaces CDNの構成に進む準備ができています。

Spaces CDNからアセットを配信するためのCDNイネーブラープラグインのインストール

Spaces CDNを使用して、現在オフロードされているファイルを提供するには、まずhttps://www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery-using-digitalocean-spaces-cdn#enabling -spaces-cdn [CDNが有効になっていることを確認してください]スペース。

SpaceでCDNを有効にしたら、https：//wordpress.org/plugins/cdn-enabler/ [CDN Enabler] WordPressプラグインをインストールして構成し、メディアライブラリアセットへのリンクを書き換えることができます。プラグインはこれらのアセットへのリンクを書き換えて、Spaces CDNエンドポイントから提供されるようにします。

CDNイネーブラーをインストールするには、WordPress管理インターフェースの*プラグイン*メニューを使用するか、コマンドラインから直接プラグインをインストールします。ここでは、後者の手順を示します。

まず、WordPressサーバーにログインします。次に、プラグインディレクトリに移動します。

cd /wp-content/plugins

上記のパスをWordPressインストールへのパスに置き換えてください。

コマンドラインから、 `+ wp-cli +`インターフェースを使用してプラグインをインストールします：

wp plugin install cdn-enabler

次に、プラグインをアクティブにします。

wp plugin activate cdn-enabler

https://codex.wordpress.org/Managing_Plugins#Installing_Plugins [組み込みプラグインインストーラー]を使用して、CDNイネーブラープラグインをインストールしてアクティブ化することもできます。

WordPress管理エリアの[設定]の下に、[CDNイネーブラー]設定への新しいリンクが表示されます。 * CDNイネーブラー*をクリックします。

次の設定画面が表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/cdn_enabler_settings.png [CDN Enabler Settings]

表示されたフィールドを次のように変更します。

* CDN URL *：Spacesダッシュボードから見つけることができるSpaces * Edge *エンドポイントを入力します。このチュートリアルでは、これは `+ https：//。nyc3.cdn.digitaloceanspaces.com `です。 Spaces CDNでカスタムサブドメインを使用している場合は、ここにそのサブドメインを入力します。たとえば、「 https：//.example.com+」。
含まれるディレクトリ：「+ wp-content / uploads 」と入力します。 https://www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery-using-digitalocean-spacesで他の ` wp-content +`ディレクトリを提供する方法を学びます-cdn＃offload-additional-assets [追加資産のオフロード]セクション。
除外：デフォルトの `+ .php`のままにします
相対パス：チェックボックスをオンのままにします
* CDN HTTPS *：チェックボックスをオンにして有効にします
残りの2つのフィールドは空白のままにします

次に、* Save Changes *を押してこれらの設定を保存し、WordPressサイトで有効にします。

この時点で、WordPressサイトのメディアライブラリをDigitalOcean Spacesに正常にオフロードし、CDNを使用してエンドユーザーに提供しています。

このステップでは、WordPressテーマまたはその他の「+ wp-content +」アセットをオフロードしませんでした。これらのアセットをSpacesに転送し、Spaces CDNを使用して提供する方法については、https：//www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery-using-digitaloceanにスキップしてください。 -spaces-cdn＃offload-additional-assets-（オプション）[追加資産のオフロード]。

追加資産のオフロード（オプション）

このガイドの前のセクションで、サイトのWordPressメディアライブラリをSpacesにオフロードし、Spaces CDNを使用してこれらのファイルを提供する方法を学びました。このセクションでは、テーマ、JavaScriptファイル、フォントなどの追加のWordPressアセットのオフロードと提供について説明します。

これらの静的アセットのほとんどは、 `+ wp-content `ディレクトリ（ ` wp-themes +`を含む）内にあります。このディレクトリのURLをオフロードして書き換えるには、KeyCDNが開発したオープンソースプラグインであるhttps://wordpress.org/plugins/cdn-enabler/[CDN Enabler]を使用します。

https://www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery-using-digitalocean-spaces-cdn#wordpress-offload-media-plugin [を使用している場合WP Offload Mediaプラグイン]、https：//deliciousbrains.com/wp-offload-media/doc/assets-pull-addon/ [Asset Pull addon]を使用して、プルCDNを使用してこれらのファイルを提供できます。このアドオンのインストールと設定は、このガイドの範囲外です。詳細については、DeliciousBrains製品https://deliciousbrains.com/wp-offload-media/doc/assets-pull-addon/[page]をご覧ください。

まず、CDNイネーブラーをインストールします。次に、WordPressテーマをSpacesにコピーし、最後にSpaces CDNを使用してこれらを配信するようにCDNイネーブラーを構成します。

前の手順でCDNイネーブラーを既にインストールしている場合は、手順2に進みます。

ステップ1-CDNイネーブラーのインストール

CDNイネーブラーをインストールするには、WordPressサーバーにログインします。次に、プラグインディレクトリに移動します。

cd /wp-content/plugins

上記のパスをWordPressインストールへのパスに置き換えてください。

コマンドラインから、 `+ wp-cli +`インターフェースを使用してプラグインをインストールします：

wp plugin install cdn-enabler

次に、プラグインをアクティブにします。

wp plugin activate cdn-enabler

WordPress管理エリアの[設定]の下に、[CDNイネーブラー]設定への新しいリンクが表示されます。 * CDNイネーブラー*をクリックします。

次の設定画面が表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/cdn_enabler_settings.png [CDN Enabler Settings]

この時点で、CDNイネーブラーが正常にインストールされました。それでは、WordPressテーマをSpacesにアップロードしてください。

ステップ2-静的なWordPressアセットをスペースにアップロードする

このチュートリアルでは、基本的なプラグイン構成を示すために、WordPressテーマのPHP、JavaScript、HTML、および画像ファイルを含むWordPressディレクトリである `+ wp-content / themes `のみを提供します。オプションで、このプロセスを ` wp-includes `のような他のWordPressディレクトリ、さらには ` wp-content +`ディレクトリ全体に拡張できます。

このチュートリアルでWordPressのインストールで使用されるテーマは `+ twentyseventeen +`です。これは、執筆時点でのWordPressの新規インストールのデフォルトテーマです。他のテーマまたはWordPressコンテンツに対してこれらの手順を繰り返すことができます。

最初に、 `+ s3cmd`を使用してテーマをDigitalOcean Spaceにアップロードします。「+ s3cmd +」をまだ設定していない場合は、DigitalOcean Spaces Product Documentationをご覧ください。

WordPressインストールの `+ wp-content`ディレクトリに移動します：

cd /wp-content

ここから、 `+ s3cmd `を使用して、 ` themes `ディレクトリをDigitalOcean Spaceにアップロードします。この時点で、単一のテーマのみをアップロードすることもできますが、簡単にするため、サーバーから可能な限り多くのコンテンツをオフロードするために、 ` themes +`ディレクトリ内のすべてのテーマをSpaceにアップロードします。

+ find +`を使用してPHP以外の（したがってキャッシュ可能な）ファイルのリストを作成し、それをSpacesにアップロードするために `+ s3cmd +`にパイプします。 CSSスタイルシートもこの最初のコマンドで除外します。アップロードするときに `+ text / css + MIMEタイプを設定する必要があるためです。

find themes/ -type f -not \( -name '*.php' -or -name '*.css' \) | xargs -I{} s3cmd put --acl-public {} s3:///wp-content/{}

上記のコマンドの「++」をスペース名に置き換えてください。

ここでは、 + themes / +`ディレクトリ内のファイルを検索するように `+ find`に指示し、 + .php`ファイルと `+ .css`ファイルを無視します。次に、 `+ xargs -I {} `を使用してこのリストを反復処理し、各ファイルに対して ` s3cmd put `を実行し、Spacesでファイルの権限を `-acl-public `を使用して ` public +`に設定します。

次に、CSSスタイルシートについても同じことを行い、 +-mime-type =" text / css "+`フラグを追加して、Spacesのスタイルシートに `+ text / css + MIMEタイプを設定します。これにより、Spacesが正しい + Content-Type：text / css + HTTPヘッダーを使用してテーマのCSSファイルを提供します。

find themes/ -type f -name '*.css' | xargs -I{} s3cmd put --acl-public  {} s3:///wp-content/{}

繰り返しますが、上記のコマンドの「++」をスペース名に置き換えてください。

テーマをアップロードしたので、スペースの正しいパスでテーマが見つかることを確認しましょう。 DigitalOcean Cloud Control Panelを使用して、スペースに移動します。

+ wp-content`ディレクトリを入力し、続いて + themes`ディレクトリを入力します。ここにテーマのディレクトリが表示されます。そうでない場合は、「+ s3cmd +」設定を確認し、テーマをスペースに再アップロードします。

ステップ3-CDNイネーブラーを設定してアセットリンクを書き換える

テーマがスペースに存在し、正しいメタデータを設定したら、CDNイネーブラーとDigitalOcean Spaces CDNを使用してファイルの提供を開始できます。

WordPress管理エリアに戻り、設定*をクリックしてから CDNイネーブラー*をクリックします。

ここで、表示されるフィールドを次のように変更します。

* CDN URL *：*ステップ1 *で行ったように、Spaces * Edge *エンドポイントを入力します。このチュートリアルでは、これは `+ https：//。nyc3.cdn.digitaloceanspaces.com `です。 Spaces CDNでカスタムサブドメインを使用している場合は、ここにそのサブドメインを入力します。たとえば、「 https：//.example.com+」。
含まれるディレクトリ：MLFPプラグインを使用していない場合、これは `+ wp-content / themes `である必要があります。もしそうなら、これは ` wp-content / uploads、wp-content / themes`でなければなりません
除外：デフォルトの `+ .php`のままにします
相対パス：チェックボックスをオンのままにします
* CDN HTTPS *：チェックボックスをオンにして有効にします
残りの2つのフィールドは空白のままにします

最終的な設定は次のようになります。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/cdn_enabler_final.png [CDN Enabler Final Settings]

[変更を保存]をクリックしてこれらの設定を保存し、WordPressサイトで有効にします。

この時点で、WordPressサイトのテーマアセットをDigitalOcean Spacesに正常にオフロードし、CDNを使用してエンドユーザーに提供しています。 https://www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery-using-digitalocean-spaces-cdn#test-で説明されている手順に従って、ChromeのDevToolsを使用してこれを確認できます。 cdn-caching [下]。

CDNイネーブラープラグインを使用して、 `+ wp-includes `のような他のWordPressディレクトリ、さらには ` wp-content +`ディレクトリ全体に対してこのプロセスを繰り返すことができます。

CDNキャッシングのテスト

このセクションでは、WordPressアセットの提供元を決定する方法を示します（例：ホストサーバーまたはCDN）Google ChromeのDevToolsを使用します。

手順1-サンプル画像をメディアライブラリに追加して同期をテストする

まず、サンプル画像をメディアライブラリーにアップロードし、DigitalOcean Spaces CDNサーバーから提供されていることを確認します。 WordPress管理Webインターフェースを使用するか、 `+ wp-cli `コマンドラインツールを使用して画像をアップロードできます。このガイドでは、 ` wp-cli`を使用してサンプル画像をアップロードします。

コマンドラインを使用してWordPressサーバーにログインし、設定した非ルートユーザーのホームディレクトリに移動します。このチュートリアルでは、ユーザー**を使用します。

cd

ここから、 `+ curl +`を使用してDigitalOceanロゴをDropletにダウンロードします（テストする画像が既にある場合は、この手順をスキップします）。

curl https://assets.digitalocean.com/logos/DO_Logo_horizontal_blue.png > do_logo.png

ここで、 `+ wp-cli +`を使用して画像をメディアライブラリにインポートします。

wp media import --path=/ /home//do_logo.png

必ず `++`をWordPressファイルを含むディレクトリへの正しいパスに置き換えてください。

警告が表示される場合がありますが、出力は次のようになります。

OutputImported file '/home/sammy/do_logo.png' as attachment ID 10.
Success: Imported 1 of 1 items.

これは、テストイメージがWordPress Media Libraryに正常にコピーされ、お好みのオフロードプラグインを使用してDigitalOcean Spaceにアップロードされたことを示しています。

DigitalOcean Spaceに移動して確認します。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/spaces_upload_confirm.png [Spaces Upload Success]

これは、オフロードプラグインが期待どおりに機能しており、WordPressのアップロードをDigitalOcean Spaceに自動的に同期していることを示しています。スペースでのメディアライブラリのアップロードへの正確なパスは、WordPressファイルをオフロードするために使用しているプラグインによって異なります。

次に、このファイルがWordPressを実行しているサーバーからではなく、Spaces CDNを使用して提供されていることを確認します。

ステップ2-アセットURLの検査

WordPress管理エリア（ + https：/// wp-admin +）から、左側のナビゲーションメニューの*ページ*に移動します。

アップロードされた画像を含むサンプルページを作成して、配信元を判断します。 WordPressサイトの既存のページに画像を追加して、このテストを実行することもできます。

*ページ*画面から、*サンプルページ*または既存のページをクリックします。または、新しいページを作成できます。

ページエディタで、[メディアの追加]をクリックし、DigitalOceanロゴ（またはこの手順のテストに使用した他の画像）を選択します。

Attachment Details ペインが画面の右側に表示されます。このペインから、 Insert into page *をクリックしてページに画像を追加します。

次に、ページエディターに戻り、右側の*公開*ボックスで*公開*（新しいサンプルページを作成した場合）または*更新*（既存のページに画像を追加した場合）をクリックします。画面の。

ページが正常に更新されて画像が含まれるようになったので、ページタイトルの下の* Permalink *をクリックしてそのページに移動します。 Webブラウザーでこのページに移動します。

このチュートリアルの目的上、次の手順ではGoogle Chromeを使用していることを前提としていますが、最新のWebブラウザーを使用して同様のテストを実行できます。

ブラウザでレンダリングされたページのプレビューから、画像を右クリックして、[*検査]をクリックします。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/inspect.png [検査メニュー]

DevToolsウィンドウが表示され、ページのHTMLの「+ img +」アセットが強調表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/devtools_output.png [DevTools Output]

このURLにDigitalOcean SpaceのCDNエンドポイントが表示されます（このチュートリアルでは、Spaces CDNエンドポイントは + https：//。cdn.digitaloceanspaces.com +）。これは、画像アセットがDigitalOcean Spacesから提供されていることを示します。 CDNエッジキャッシュ。 Spaces CDNでカスタムサブドメインを使用している場合、アセットURLはこのカスタムサブドメインを使用する必要があります。

これにより、メディアライブラリのアップロードがDigitalOcean Spaceに同期され、Spaces CDNを使用して提供されていることが確認されます。

ステップ3-アセットレスポンスヘッダーの検査

DevToolsウィンドウから、1つの最終テストを実行します。ウィンドウの上部にあるツールバーの[ネットワーク]をクリックします。

空白の* Network *ウィンドウに移動したら、表示された指示に従ってページをリロードします。

ページ資産がウィンドウに表示されます。ページアセットのリストでテストイメージを見つけます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/devtools_asset_list.png [Chrome DevTools Asset List]

テスト画像を見つけたら、クリックして追加情報ペインを開きます。このペイン内で、* Headers *をクリックして、このアセットの応答ヘッダーを表示します。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/response_headers.png [応答ヘッダー]

CDN応答ヘッダーである + Cache-Control HTTPヘッダーが表示されます。これにより、このイメージがSpaces CDNから提供されたことを確認できます。

ステップ4-テーマアセットのURLの検査（オプション）

https://www.digitalocean.com/community/tutorials/how-to-speed-up-wordpress-asset-delivery-using-digitalocean-スペース-cdn＃offload-additional-assets [追加アセットのオフロード]では、次の簡単なチェックを実行して、テーマのアセットがスペースCDNから提供されていることを確認する必要があります。

Google ChromeでWordPressサイトに移動し、ページ内の任意の場所を右クリックします。表示されるメニューで、*検査*をクリックします。

もう一度Chrome DevToolsインターフェースが表示されます。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/chrome_devtools_theme_confirm.png [Chrome DevToolsインターフェイス]

ここから、* Sources *をクリックします。

左側のペインに、WordPressサイトのアセットのリストが表示されます。 CDNエンドポイント（またはカスタムサブドメイン）まで下にスクロールし、エンドポイント名の横にある小さな矢印をクリックしてリストを展開します。

image：https：//assets.digitalocean.com/articles/wordpress_cdn_offload/devtools_sources_assets.png [DevTools Site Asset List]

WordPressテーマのヘッダー画像、JavaScript、CSSスタイルシートがSpaces CDNから提供されていることを確認してください。

結論

このチュートリアルでは、WordPressサーバーからDigitalOcean Spacesに静的コンテンツをオフロードし、Spaces CDNを使用してこのコンテンツを提供する方法を示しました。ほとんどの場合、これにより、ホストインフラストラクチャの帯域幅が削減され、エンドユーザー、特にWordPressサーバーから地理的に離れた場所にいるエンドユーザーのページ読み込みが高速化されます。

Spaces CDNを使用して、メディアライブラリと `+ themes `アセットの両方をオフロードして提供する方法を示しましたが、これらの手順を拡張して、 ` wp-content `ディレクトリ全体と ` wp-includes +`をさらにアンロードできます。

CDNを実装して静的アセットを配信することは、WordPressインストールを最適化する1つの方法にすぎません。 W3 Total Cacheなどの他のプラグインは、ページの読み込みをさらに高速化し、サイトのSEOを改善できます。ページの読み込み速度を測定して改善するのに役立つツールは、Googleのhttps://developers.google.com/speed/pagespeed/insights/[PageSpeed Insights]です。要求と応答時間のウォーターフォール内訳と推奨される最適化を提供する別の便利なツールは、https：//www.pingdom.com/ [Pingdom]です。

コンテンツ配信ネットワークとその仕組みの詳細については、https：//www.digitalocean.com/community/tutorials/using-a-cdn-to-speed-up-static-content-delivery [CDNを使用して高速化する静的コンテンツ配信]。

TOC