メインコンテンツにスキップ

新しい公開基盤(Beta)に切り替える

Studioの公開基盤を、従来のSPA(CSR)ベースからMPA(SSR)ベースに切り替える機能について説明します。表示速度やSEO/AEOの改善につながるポイントと、切り替え手順、注意点をまとめます。

今日アップデートされました

2026年1月に、公開サイトのパフォーマンスを向上させるための新しいレンダリング方式を適用できる「公開基盤の切り替え機能(Beta)」の提供を開始しました。

従来はSPA(Single Page Application)+CSR(Client Side Rendering)を前提とした公開でしたが、新しい公開基盤ではMPA(Multi Page Application)+SSR(Server Side Rendering)でページを配信します。

これにより、ページ読み込みのパフォーマンスが向上し、検索エンジンやAIによるコンテンツの理解(SEO/AEO)の面でもメリットが期待できます。

この記事では、SPA/MPAやCSR/SSRといった用語の意味も補足しながら、Studioの新しい公開基盤の特徴とUI上の切り替え手順、利用時の注意点について説明します。


従来の公開基盤と新しい公開基盤の違い

まずは、従来の公開基盤(SPA+CSR)と、新しい公開基盤(MPA+SSR)の違いについて解説します。

従来基盤(SPA+CSR)の仕組みと特長

  • SPA(Single Page Application)
    単一のHTMLを基点に、JavaScriptでページ内のコンテンツを動的に切り替えることで、画面遷移をシームレスに見せる仕組みです。

  • CSR(Client Side Rendering)
    ブラウザ側のJavaScriptがHTMLを組み立てて画面に描画します。

Studioの従来の公開基盤は、このSPAとCSRを組み合わせた構成で提供しており、一度読み込んだあとの画面切り替えが軽く、複数ページで構成されるサイト内回遊でもインタラクティブな体験を実現しやすいという利点があります。

新基盤(MPA+SSR+キャッシュ)の仕組みと特長

  • MPA(Multi Page Application)
    複数のHTMLページで構成され、ページ遷移のたびにサーバーから新しいHTMLを取得して再読み込みする仕組みです。

  • SSR(Server Side Rendering)
    サーバー側でHTMLをレンダリングし、完成したHTMLをブラウザに返します。

  • キャッシュ(CDNキャッシュ)
    新しい公開基盤では、SSRで生成されたHTMLがCDNにキャッシュされます。一度アクセスされたページは、この生成済みHTMLに対して2回目以降のアクセスが行われるため、同じページへの再アクセス時の表示が高速になります。

Studioの新しい公開基盤では、このMPA+SSR+キャッシュ構成で公開されるため、HTMLにあらかじめテキストやメタ情報が含まれた状態になり、ページ読み込みの速さや表示の安定性、SEO/AEOの観点で有利になりやすいという特長があります。

さらに、一度生成されたHTMLをCDNキャッシュから配信することで、再アクセス時のレスポンスも高速になり、多くのユーザーがアクセスするサイトでも安定した表示が期待できます。

Point: キャッシュ生成のタイミング

キャッシュが再構築される主なタイミングは、次のとおりです。

  • サイトの再公開を行ったとき

  • CMSコンテンツを公開・更新・削除したとき

  • Studioの公開エンジンがアップデートされたとき

これらの操作が行われると、サイト全体のHTMLが再度生成され、次回アクセス時には新たなCDNキャッシュが構築されます。


新しい公開基盤のメリット

ここでは、新しい公開基盤(MPA+SSR)を利用することで得られる主なメリットを説明します。

表示速度と安定性の向上

  • 初回表示時に、テキストや画像を含んだHTMLがそのまま返されるため、ファーストビューが安定しやすくなります。

  • 回線速度が遅い環境や、性能が高くない端末でも、表示崩れや長い白画面になりにくくなります。

SEO/AEOへの効果

  • ページの本文や見出し、メタ情報がHTML上に出力されるため、検索エンジンがページ構造を正しく把握しやすくなります。

  • AIによる検索結果の要約や回答でも、SSRで生成されたテキストを参照しやすくなり、AEOの観点でもメリットがあります。


ベータ版としての提供範囲

新しい公開基盤は、将来的にデフォルトの公開方式とすることを見据え、まずはベータ版として段階的に提供しています。

現時点では、一部機能との互換性が十分でないケースがあり、さまざまなサイトへの対応状況を検証・改善している段階です。

一方で、互換性が確認できているサイトについては、ページ読み込みの速さやSEO/AEOの改善といった利点を活かせるよう、ユーザー自身で切り替えられる仕組みとなっています。

現時点で把握できている互換性の問題や不具合事象については、専用の案内ページにまとめており、内容は随時アップデートしていく予定です。

新しい基盤での公開を試してみたい場合には、本記事で説明している 切り替え手順 を参考に、公開基盤を切り替えてください。

ベータ版利用時の注意点

  • ベータ提供期間中は、検証と機能改善を最優先として対応します。そのため、有人でのチャットサポートについては、原則として新しい公開基盤を対象外とし、互換性の問題や不具合事象については送信専用の問い合わせ窓口からの報告をお願いしています。

    いただいた報告内容をもとに、よりさまざまなサイトで利用できる状態を目指して、正式リリースに向けた改善を継続します。

  • ベータ期間中の公開基盤切り替えにあたっては、切り替えの前後で表示や計測、フォーム送信などを十分にテストできる状態でのご利用をおすすめします。

  • 重要なコンバージョンページや大きなトラフィックがあるサイトでは、切り替えを行う前に関係者間での合意を取ることをおすすめします。


公開基盤の切り替え手順

ここでは、StudioのUI上で公開基盤を切り替える流れを説明します。

事前準備

  • 対象のサイトのプロジェクトを開き、現在の公開中サイトの表示を確認します。

  • 必要に応じて、現状のサイトを別環境やスクリーンショットで記録しておきます。

公開基盤を切り替える

  1. 対象プロジェクトのダッシュボード > [プロジェクト設定]を開きます。

  2. [公開サイト基盤の切替] > [設定]を開きます。

  3. 利用したい公開基盤を選択します。

  4. 説明文や注意事項を確認し、問題なければ設定を[保存]します。

Point: 保存ボタン押下から切り替え完了までは、5分程度かかります。

切り替えを確認し、キャッシュを作成する(初回のみ)

  1. 公開サイトを開き、ブラウザの検証ツールを立ち上げます。

    💡 Chromeの検証ツールは、画面上を右クリック > [検証]で表示できます。

  2. [要素 / Elements] タブを開き、「Studio.Design.HRC」というキーワードで検索します。

    💡 検索機能は [ctrl / cmd ⌘]+[F] で立ち上げます。

  3. <meta name="generator" content="Studio.Design.HRC"> という表示が確認できたら、切り替え完了です。

  4. 最後に サイトの更新操作 を行い、初回のキャッシュを生成します。

Tips: 初回キャッシュ生成を行うことで、公開後初めてのサイト訪問者に対しても、サイトコンテンツを高速に提供できます。

切り替え後は初回のみこの操作を行えば、以降はサイトの更新・公開操作ごとにキャッシュが自動で生成されます。


切り替え時の注意点とおすすめの進め方

ベータ版としての制限・注意点

  • 一部の機能における互換性の課題や、公開サイト上での不具合が確認されています。詳細は 🔗 公開サイト新基盤 (beta) Issues を確認してください。

  • ベータ期間中、各種課題や不具合の解消を順次進める過程で、特定の既存機能やカスタムコードを利用している場合は、途中で挙動が変わる可能性があります。

  • 外部サービスやJavaScriptのような動的なコードを読み込むスクリプトを使用している場合は、対象箇所がMPA+SSR環境でも想定どおり動くかを本番運用前に確認してください。

  • Aレコードが旧IPアドレス「35.194.122.208」に向いている独自ドメインサイトは、新しい基盤に切り替えることができません。新基盤ご利用前に、Aレコードの向き先を「34.111.141.225」に変更してください。

  • 大きな不具合の解消と互換性の確認が完了した後、将来的には新しい公開基盤がデフォルトになる想定です。

段階的な切り替えを推奨

  • 重要度の高い運用中のサイトでの切り替えを想定している場合、テスト用のプロジェクトなどを使って、新しい公開基盤での挙動を先に検証することをおすすめします。

  • 外部サービスを使ってコンバージョンを計測しているページでは、本番運用を開始する前にテストすることをおすすめします。

  • 大規模なトラフィックがあるサイトでは、本番切り替え前に検証用環境で負荷や動作を確認することをおすすめします。


関連記事:

こちらの回答で解決しましたか?