Vercel の Next.js 導入後の国内加速メモ

原因: 導入はスムーズに進みましたが、中国では開くことができませんでした。

このサイトは Next.js で書かれており、Vercel にプッシュされています。自動的に証明書を構築し、自動的に署名し、グローバル エッジ ノードを配布します。プロセス全体が非常にスムーズなので、間違いはありません。海外で開くときも数秒で開けて、充実した体験をお楽しみいただけます。

しかし、中国に帰国するとすぐに、元の形が明らかになりました。Vercel によってデフォルトで割り当てられた *.vercel.app ドメイン名は、中国では開くことができません。 DNS を解決できないか、接続がスピンしてタイムアウトになります。自分で使用する場合はエージェントに連絡することができますが、これは他の人が使用するサイトであるため、すべての訪問者にはしごを持参するよう要求することはできません。

したがって、最初の反応は次のとおりです。独自のドメイン名を結び付ける。確かに結んだ後は開けることができますが、速度はまだ快適ではありません。最初の画面が表示されるまでに数秒待つ必要があることがよくあり、特定のリソースで半日スタックすることもあります。では、問題がどこにあるのかについて話しましょう。

何が問題ですか?

ドメイン名「*.vercel.app」は中国では「汚染」されているため、直接使用することは基本的には役に立ちません。独自のドメイン名をバインドすることでこれを回避できますが、独自のドメイン名をバインドするだけでは十分ではありません。キーは解決する場所によって異なります。

Vercel がドメイン名をバインドすると、デフォルトで CNAME が cname.vercel-dns.com を指すように指示されます。このアドレスは Vercel のグローバル エッジ ネットワークを使用します。ノードは主に海外にあり、中国に最も近いのは香港、日本、シンガポールです。国内ユーザーは遠回りしてアクセスすることが多く、夕方のラッシュ時はとんでもなく遅い。性能は以下の通りです。

• 最初の画面は数秒間空白でしたが、HTML が表示され、リソースの読み込みが遅くなりました。
• 直接タイムアウトして更新すると再び正常になる場合があります。とても神秘的です。
• これはモバイル ネットワークで特に顕著ですが、4G/5G は 2G のように感じられます。

おそらくこんな感じです。読み込みバーを動かすのは非常に難しく、ほとんどがブロックされています。

処理：国内解析入口に変更

実際、Vercel にはこの国への特別な入り口がありますが、デフォルトでは積極的に通知しません。解決策はたった 1 つのステップです。CNAME を cname-china.vercel-dns.com に指定します。真ん中に余分な「チャイナ」があることに注意してください。

具体的な操作:

1. Vercel でドメイン名をバインドします: [プロジェクト設定] → [ドメイン] で独自のドメイン名を入力します。Vercel は CNAME レコードを追加するように求めます。
2. ドメイン ネーム サービス プロバイダーに移動して解決を変更します: DNS 解決設定を見つけて、CNAME レコードの値をデフォルトの「cname.vercel-dns.com」から「cname-china.vercel-dns.com」に変更します。必要に応じてホスト レコードを入力します。通常は「www」または「@」を使用します。
3. 有効になるまで待ちます: DNS が有効になるまでには、通常、数分から 30 分かかります。 Vercel は解像度が正しいことを検出し、自動的に HTTPS 証明書を発行し、通常どおりアクセスできるようになります。

注意: CNAME をルート ドメイン名 (つまり、「@」) に追加できるかどうかは、ドメイン名レジストラ** によって異なります。一部のレジストラはルート ドメインの直接 CNAME をサポートしていないため、「www」サブドメインを使用し、ルート ドメイン 301 を「www」にジャンプしても同じ効果が得られます。現在、ほとんどのサービスプロバイダーはいわゆる「CNAME強制タイル」（ルートドメインをCNAMEとして扱う）をサポートしており、CloudflareとDNSPodは問題ありません。

この 1 文字を「cname.vercel-dns.com」から「cname-china.vercel-dns.com」に変更するだけです。

＃＃ 効果

改造後は、身体的な感覚が非常に明白です。同じネットワーク環境の場合:

• 最初の画面は数秒で開き、空白の画面が表示されるまで待つ必要はありません
• リソースのロードはスムーズで、夕方のラッシュアワーでも中断はありません。
• モバイルネットワークでも通常通り使用可能

比較すると以下のようになりますが、表と裏では全く違います。

簡単に言うと「ギリギリ開ける」から「かなり早い」に変わりました。主要な違いは、この「中国」の入り口が国内トラフィックをより近くでより安定したノードに誘導し、大きな海底ケーブルの必要性を排除することです。

＃＃ まとめ

プロセス全体は実際には非常に簡単で、高度な操作はありません。難しいのは、そのような入り口があることを知ることだけです。 Vercel はデフォルトでグローバル解決アドレスを使用しますが、これは国内ユーザーには不向きです。 「中国」と付いているものは国内向けに用意されています。

したがって、Vercel を導入し、国内ユーザーをターゲットにしている場合は、次の 1 つの文を覚えておいてください。

ドメイン名をバインドし、CNAME を cname-china.vercel-dns.com に指定し、残りは時間を待ちます。

さらに、このソリューションは中小規模のサイトの軽量アクセラレーションにも適しています。訪問数が一定のレベルに達した場合、または国内の速度要件が非常に高い場合は、国内 CDN の追加を検討してください。これについては別の記事で説明します。