NocoBase をより速くデプロイする方法

NocoBase をデプロイする際、アクセス速度が遅いと感じる方も多いのではないでしょうか。これは通常、ネットワーク環境、サーバー構成、デプロイアーキテクチャの影響によるものです。最適化テクニックを紹介する前に、まず通常構成での NocoBase アクセス速度の目安をお見せして、不要な心配を解消しましょう。

NocoBase の通常読み込み速度の目安

以下は NocoBase の demo 環境でテストした読み込み速度です：

URL を入力してアプリケーションに初めてアクセスするまでの時間は約 2 秒
アプリケーション内でのページ切り替えに必要な時間は約 50〜300 ミリ秒

ここからは、シンプルかつ効果的なデプロイ最適化テクニックを紹介します。これらの方法はコードの変更を必要とせず、デプロイ設定の調整だけでアクセス速度を大幅に向上させることができます：

I. ネットワークとインフラの最適化

1. HTTP プロトコルバージョン：HTTP/2 を手軽に導入

【前提条件】

HTTPS サポートが必要：これは重要なポイントです！ほぼすべてのモダンブラウザは HTTPS 接続上でのみ HTTP/2 をサポートしているため、まず SSL 証明書を設定する必要があります。
サーバー要件：HTTP/2 をサポートするサーバーソフトウェア（Nginx 1.9.5 以降や Apache 2.4.17 以降など）が必要です。
TLS バージョン：TLS 1.2 以上（TLS 1.3 が最適）の使用を推奨します。古い SSL バージョンでは HTTP/2 はサポートされません。

【ヒント】

従来の HTTP/1.1 プロトコルでは、複数のリクエストを処理する際に制限があります。通常は同時に 6〜8 接続しか処理できず、チケット売り場の行列のように遅延が発生しやすくなります。 250409http1

HTTP/2 は「多重化」技術を採用しており、複数のリクエストを同時に処理できるため、リソースの読み込みが大幅に高速化されます。最新の HTTP/3 は不安定なネットワークでさらに優れたパフォーマンスを発揮します。

250409http2

【最適化のアドバイス】

Web サーバーで HTTP/2 サポートが有効になっていることを確認してください。現在のほとんどのサーバー（Nginx、Caddy など）では簡単に設定できます。
Nginx では、listen ディレクティブに http2 パラメータを追加するだけです：

listen 443 ssl http2;

【検証方法】

ブラウザの開発者ツールを開き、「ネットワーク」タブで右クリックして「プロトコル」にチェックを入れると、現在の接続プロトコルバージョンが確認できます： 20250407145442

実測では、全体的な速度が約 10% 向上しました。システム内に大量のブロックやリソースがある場合、パフォーマンスの向上はさらに顕著になります。

2. ネットワーク帯域幅：大きいほど良い、柔軟な課金方式

【ヒント】

高速道路が低速道路よりもスムーズなように、帯域幅はデータ転送の効率を決定します。NocoBase の初回読み込み時には大量のフロントエンドリソースをダウンロードする必要があるため、帯域幅が不足するとボトルネックになりやすくなります。

【最適化のアドバイス】

十分な帯域幅を確保してください（多くのユーザーが利用する場合は 50M 以上を推奨）。この重要なリソースを節約しすぎないようにしましょう。
「従量課金」方式を推奨します。多くのクラウドサービスプロバイダーがこの柔軟なモデルを提供しており、ピーク時にはより高い帯域幅を利用でき、通常時はコストを抑えることができます。

3. ネットワーク遅延とサーバーの地理的位置：近いほど反応が速い

【ヒント】

遅延とは、データ転送の待ち時間のことです。帯域幅が十分でも、サーバーがユーザーから遠い場所にある（例えば、ユーザーが日本にいてサーバーがアメリカにある場合）と、リクエストのたびに距離による遅延が速度を低下させる可能性があります。

【最適化のアドバイス】

NocoBase は主要なユーザー層に近い地域にデプロイするようにしてください。
ユーザーが世界中に分散している場合は、グローバルアクセラレーションサービス（例：Alibaba Cloud グローバルアクセラレーションや AWS Global Accelerator）の利用を検討し、ネットワークルーティングを最適化して遅延を低減しましょう。

【検証方法】

ping コマンドで異なる地域のサーバーの遅延をテストします。この方法は最も効果が顕著で、地域によってアクセス速度が 1〜3 倍以上向上します。 12 タイムゾーン離れた場合、13 秒： 20250409130618

2 タイムゾーン離れた場合、8 秒： 20250409131039

同一地域の場合、約 3 秒： 20250409130928

II. デプロイアーキテクチャの最適化

4. サーバーデプロイとプロキシ方式：最適なアーキテクチャを選択する

【前提条件】

サーバー権限：Nginx などのサービスを設定するには、サーバーの root または sudo 権限が必要です。
基本スキル：基本的なサーバー設定の知識が必要ですが、心配いりません。具体的な設定例を提供します。
ポートアクセス：ファイアウォールがポート 80（HTTP）と 443（HTTPS）のアクセスを許可していることを確認してください。

【ヒント】

ユーザーが NocoBase にアクセスすると、リクエストはサーバーに直接到達します。適切なデプロイ方式を選択することで、サーバーがリクエストをより効率的に処理し、より速いレスポンスを提供できます。

【各方式とアドバイス】

NocoBase 起動後、リバースプロキシなしで静的リソースを配信（非推奨）：

デメリット：この方式はシンプルですが、高負荷時や静的ファイルの処理でパフォーマンスが弱く、開発・テスト向きです。
アドバイス：この方式はできるだけ避けてください。

参考：「インストールドキュメント」

リバースプロキシなしの場合、トップページの読み込みは約 6.1 秒 20250409131357

Nginx / Caddy などのリバースプロキシを使用（強く推奨）：

メリット：リバースプロキシサーバーは、並行接続の効率的な処理、静的ファイルの配信、ロードバランシングが可能で、HTTP/2 の設定も簡単です。
アドバイス：本番環境では、アプリケーションデプロイ完了後（ソースデプロイ / create-nocobase-app / Docker イメージ）、Nginx または Caddy をリバースプロキシとして使用してください。

参考：「デプロイドキュメント」

Nginx プロキシ使用後、トップページの読み込みは約 3〜4 秒 20250409131541

20250407192453

クラスターデプロイとロードバランシングの使用（高負荷・高可用性シーン向け）：

メリット：複数のインスタンスでリクエストを処理することで、システム全体の安定性と並行処理能力を大幅に向上させることができます。
具体的なデプロイ方法は クラスターモード をご覧ください。

5. CDN で静的リソースを高速化する

【前提条件】

ドメイン要件：登録済みのドメインがあり、その DNS 設定を管理できる必要があります。
SSL 証明書：ほとんどの CDN サービスでは SSL 証明書の設定が必要です（無料の Let's Encrypt を使用できます）。
サービスの選択：ユーザーの地域に応じて適切な CDN プロバイダーを選択してください（中国本土のユーザーは ICP 登録済みの CDN を選択する必要があります）。

【ヒント】

CDN（コンテンツデリバリーネットワーク）は、静的リソースを世界中のノードにキャッシュし、ユーザーが最も近いノードからリソースを取得できるようにします。最寄りの水道から水を汲むようなもので、読み込み遅延を大幅に削減できます。

さらに、CDN の最大のメリットは、アプリケーションサーバーの負荷と帯域幅の圧迫を大幅に軽減できることです。多数のユーザーが同時に NocoBase にアクセスする際、CDN がなければ、すべての静的リソースリクエスト（JavaScript、CSS、画像など）がサーバーに直接集中し、サーバーの帯域幅不足やパフォーマンス低下、さらにはダウンにつながる可能性があります。CDN でこれらのリクエストを分散させることで、サーバーはコアビジネスロジックの処理に集中でき、ユーザーにより安定したエクスペリエンスを提供できます。

202504071845_cdn

【最適化のアドバイス】サーバーを設定し、静的リソースリクエストを CDN 経由で配信します。ユーザーの所在地に応じて適切な CDN プロバイダーを選択してください：

グローバルユーザー向け：Cloudflare、Akamai、AWS CloudFront
中国本土ユーザー向け：Alibaba Cloud CDN、Tencent Cloud CDN、Baidu Cloud Acceleration

設定例：

# 静的リソースを CDN ドメインにリダイレクト
location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
    rewrite ^(.*)$ https://your-cdn-domain.com$1 permanent;
}

小規模プロジェクトでは、Cloudflare の無料版でも十分な CDN 高速化効果が得られます：

Cloudflare でアカウントを登録し、ドメインを追加します。
DNS を変更して、ドメインを Cloudflare が提供するサーバーに向けます。
コントロールパネルで適切なキャッシュレベルを設定します。

特に重要：ユーザーがすべて同じ地域にいる場合でも、CDN の使用を強くお勧めします。サーバーの負担を効果的に軽減し、特にアクセス量が多い場合にシステム全体の安定性を高めることができます。

III. 静的リソースの最適化

6. サーバー圧縮とキャッシュ設定

【前提条件】

CPU リソース：圧縮によりサーバーの CPU 負荷が増加するため、十分な処理能力が必要です。
Nginx モジュールサポート：Gzip 圧縮は通常、標準でサポートされていますが、Brotli 圧縮には追加モジュールのインストールが必要な場合があります。
設定権限：サーバー設定を変更する権限が必要です。

【ヒント】

圧縮と適切なキャッシュ戦略を有効にすることで、データ転送量と重複リクエストを大幅に削減できます。リソースに「ダイエット」を施すようなもので、読み込み速度が飛躍的に向上します。 20250409175241

【最適化のアドバイス】

最もシンプルな方法：Cloudflare の無料 CDN サービスを使えば、Gzip 圧縮が自動的に有効になります。
Gzip または Brotli 圧縮を有効にします。Nginx では以下のように設定できます：

# Gzip 圧縮を有効にする
gzip on;
gzip_comp_level 6;
gzip_min_length 1000;
gzip_proxied any;
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;

# Brotli 圧縮がサポートされている場合、より効率的な圧縮効果を得るために有効にする
brotli on;
brotli_comp_level 6;
brotli_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;

静的リソースに適切なキャッシュヘッダーを設定し、重複読み込みを削減します：

location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
    expires 30d;
    add_header Cache-Control "public, max-age=2592000";
    access_log off;
}

7. SSL/TLS の使用とパフォーマンス最適化

【前提条件】

SSL 証明書：有効な SSL 証明書が必要です（無料の Let's Encrypt を使用できます）。
サーバー設定権限：SSL 設定を変更できる必要があります。
DNS 設定：OCSP Stapling 用に信頼性の高い DNS リゾルバーを設定します。

【ヒント】

セキュリティは常に最優先ですが、HTTPS の設定が不適切だと遅延が増加する可能性があります。ここでは、セキュリティを確保しながら高いパフォーマンスを維持するための最適化テクニックを紹介します。

【最適化のアドバイス】

現時点で最速の TLS バージョンである TLS 1.3 を使用します。Nginx での設定：

ssl_protocols TLSv1.2 TLSv1.3;
ssl_prefer_server_ciphers on;
ssl_ciphers ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-CHACHA20-POLY1305:ECDHE-RSA-CHACHA20-POLY1305;

OCSP Stapling を有効にして、証明書検証にかかる時間を短縮します：

ssl_stapling on;
ssl_stapling_verify on;
resolver 8.8.8.8 8.8.4.4 valid=300s;
resolver_timeout 5s;

セッション再利用で繰り返しのハンドシェイク時間を短縮します：

ssl_session_cache shared:SSL:10m;
ssl_session_timeout 10m;

【海外アクセスシーンでの最適化効果】 特記事項：以下は海外/12 タイムゾーンをまたぐシーンでの最適化効果であり、前述のローカルアクセスシーン（約 3 秒）とは本質的に異なります。地理的距離によるネットワーク遅延は避けられませんが、最適化によって大幅な速度向上が可能です：

HTTP/2 + CDN キャッシュ + Gzip 圧縮 + Brotli 圧縮を総合的に適用した結果：最適化前（海外アクセス）、13 秒： 20250409130618 最適化後（海外アクセス）、8 秒： 20250409173528

この例は、地理的に大きく離れた状況でも、適切な最適化措置によって読み込み時間を約 40% 短縮し、ユーザーエクスペリエンスを大幅に改善できることを示しています。

IV. モニタリングと問題の特定

8. パフォーマンスモニタリングと基本分析

【前提条件】

アクセス可能性：ほとんどのオンラインテストツールを使用するには、Web サイトが公開アクセス可能である必要があります。
基本スキル：パフォーマンス指標の基本的な意味を理解する必要がありますが、各重要指標について説明します。

【ヒント】

ボトルネックがどこにあるか分からなければ、的確な最適化は困難です。無料ツールを使って Web サイトのパフォーマンスを監視し、問題箇所を特定することをお勧めします。

【最適化のアドバイス】

以下の無料ツールで Web サイトのパフォーマンスを確認してください：

以下の重要指標に注目してください：

ページ読み込み時間
サーバー応答時間
DNS 解決時間
SSL ハンドシェイク時間

よくある問題への対処：

DNS 解決が遅い？ DNS サービスの変更または DNS プリフェッチの有効化を検討してください。
SSL ハンドシェイクが遅い？ SSL 設定を最適化し、セッション再利用を有効にしてください。
サーバー応答が遅い？サーバーリソースを確認し、必要に応じてアップグレードしてください。
静的リソースの読み込みが遅い？ CDN の導入とキャッシュ戦略の調整を試してください。

デプロイ最適化クイックチェックリスト

以下のチェックリストで、NocoBase のデプロイをすばやく確認・最適化できます：

HTTP バージョンの確認
- HTTPS を有効化済み（HTTP/2 の前提条件）
- HTTP/2 を有効化済み
- 条件が許せば、HTTP/3 のサポートも検討
帯域幅の評価
- サーバーの帯域幅が十分（最低 10Mbps、50Mbps 以上を推奨）
- 固定帯域幅ではなく従量課金モデルの採用を検討
サーバー設置場所の選択
- ユーザーの所在地域に近い場所にサーバーを設置
- グローバルユーザー向けには、グローバルアクセラレーションサービスの利用を検討
デプロイアーキテクチャ
- Nginx/Caddy をリバースプロキシとして使用し、静的リソースと API を分離
- 必要に応じて、マルチインスタンスデプロイとロードバランシング技術を採用
CDN の導入
- CDN で静的リソースの配信を高速化
- 適切なキャッシュ戦略を設定
- CDN が HTTP/2 または HTTP/3 をサポートしていることを確認
圧縮とキャッシュ
- Gzip または Brotli 圧縮を有効化
- 適切なブラウザキャッシュヘッダーを設定
SSL/TLS の最適化
- TLS 1.3 を使用してハンドシェイク速度を向上
- OCSP Stapling を有効化
- SSL セッション再利用を設定
パフォーマンスモニタリング
- 定期的にパフォーマンステストツールで Web サイトを評価
- 重要指標（読み込み、応答、解決、ハンドシェイク時間）を監視
- 問題に応じた最適化調整を実施

よくある質問と回答

【問】サーバーを海外にデプロイしていますが、日本のユーザーからのアクセス速度が遅いです。どうすればいいですか？

【答】最も良い方法は、日本国内のクラウドサーバーに再デプロイすることです。どうしても変更できない場合は：

国内の CDN で静的リソースを高速化する
グローバルアクセラレーションサービスでネットワークルーティングを最適化する
すべての圧縮とキャッシュの最適化措置をできるだけ有効にする

【問】NocoBase の初回読み込みが遅いのに、その後は速いのはなぜですか？

【答】初回読み込みが遅いのは比較的普通のことです。初回は大量のリソースをダウンロードする必要があるためです。公式 Demo を例にとると、通常の初回読み込み時間は約 3 秒です。

その後の日常的な URL 入力からアプリケーション起動までの速度は約 1〜2 秒で、アプリケーション内のページ切り替え速度は約 50〜300 ミリ秒と、遅延は非常に低いです。

20250416130719

読み込み時間が長すぎる場合は、まだ最適化の余地があります：

HTTP/2 が有効になっていることを確認する
CDN 高速化を導入する
Gzip/Brotli 圧縮を有効にする
サーバーの帯域幅が十分かどうかを確認する

【問】現在共有ホスティングを使用しており、Nginx の設定を変更できません。どうすればいいですか？

【答】この場合、最適化の選択肢は限られますが、以下をお勧めします：

CDN サービス（Cloudflare など）の利用を試す
アプリケーション内で調整可能なパラメータを最適化する
条件が許せば、より多くのカスタム設定が可能な VPS へのアップグレードを検討する

これらのシンプルで実用的なデプロイ最適化戦略により、NocoBase のアクセス速度を大幅に向上させ、ユーザーにより快適なエクスペリエンスを提供できます。多くの最適化措置は数時間以内に設定を完了でき、コードの変更も不要で、手軽に効果を実感できます。

#NocoBase をより速くデプロイする方法

#NocoBase の通常読み込み速度の目安

#I. ネットワークとインフラの最適化

#1. HTTP プロトコルバージョン：HTTP/2 を手軽に導入

#2. ネットワーク帯域幅：大きいほど良い、柔軟な課金方式

#3. ネットワーク遅延とサーバーの地理的位置：近いほど反応が速い

#II. デプロイアーキテクチャの最適化

#4. サーバーデプロイとプロキシ方式：最適なアーキテクチャを選択する

#5. CDN で静的リソースを高速化する

#III. 静的リソースの最適化

#6. サーバー圧縮とキャッシュ設定

#7. SSL/TLS の使用とパフォーマンス最適化

#IV. モニタリングと問題の特定

#8. パフォーマンスモニタリングと基本分析

#デプロイ最適化クイックチェックリスト

#よくある質問と回答

NocoBase をより速くデプロイする方法

NocoBase の通常読み込み速度の目安

I. ネットワークとインフラの最適化

1. HTTP プロトコルバージョン：HTTP/2 を手軽に導入

2. ネットワーク帯域幅：大きいほど良い、柔軟な課金方式

3. ネットワーク遅延とサーバーの地理的位置：近いほど反応が速い

II. デプロイアーキテクチャの最適化

4. サーバーデプロイとプロキシ方式：最適なアーキテクチャを選択する

5. CDN で静的リソースを高速化する

III. 静的リソースの最適化

6. サーバー圧縮とキャッシュ設定

7. SSL/TLS の使用とパフォーマンス最適化

IV. モニタリングと問題の特定

8. パフォーマンスモニタリングと基本分析

デプロイ最適化クイックチェックリスト

よくある質問と回答