logoMiyauchi

ウェブサイトをリニューアルしました(SSG から RSC へ)

ウェブサイトをリニューアルしました

このたび、当ウェブサイトは内部構成を中心にリニューアルを行いました。
今回の変更は、ユーザー体験そのものよりも、運用や設計の基盤に関わる部分が中心です。

以下では、主な技術的変更点について簡単に紹介します。

SSGからRSCへ

これまで本サイトは、SSG(Static Site Generation)を前提とした構成でした。
SSG はシンプルで堅牢な構成ですが、すべてをビルド時に確定させる必要があります。

その結果、

  • ソースコードの変更でもビルドが必要
  • コンテンツの追加・修正でもビルドが必要
  • コンテンツが増えるにつれてビルド時間が伸びていく

という状態になっていました。

今回、React Server Components(RSC)を前提とした構成に移行したことで、
サイトは 静的ファイルの集合ではなく、サーバー上で動作するアプリケーションとして再構成されています。

これによって、

  • クライアントサイド JavaScript の削減
  • レンダリングやデータ取得の責務分���

といった点で、構成の自由度が高まりました。

Node.js から Deno へ

今回のリニューアルでは、ランタイムをNode.jsからDenoへ移行しました。

Denoは登場以来、Node.jsの代替として語られることが多いものの、
実際のウェブサイト運営で主流になったとは言えない状況が続いています。

一方で現在は、

  • サーバーアプリケーションとしての安定性
  • 実運用に耐えるランタイムとしての成熟

といった点も十分に揃ってきています。

今回の構成は、

  • Deno 上で
  • 特定のアプリケーションフレームワークに依存せず
  • RSC を用いた構成を運用する

という形を採っています。

RSCは特定のフレームワークを前提としなくても組み込める技術であり、
その点を実際の運用例として示すことも、今回の構成変更の一つの目的です。

ソースとコンテンツの分離

コンテンツ管理についても変更を行っています。

これまでの構成は、ソースコードとコンテンツが 同じリポジトリで管理されている状態でした。

これは小規模なうちは問題になりませんが、
コンテンツが増えるにつれて、次のような課題が顕在化してきました。

  • ソースコードとコンテンツの責務が曖昧になる
  • エディタ上での閲���性が��������る

今回のリニューアルでは、コンテンツを外部ソースとして管理する形に切り替え、ソースコードとコンテンツを明確に分離しています。

おわりに

今回のリニューアルは、サイトを「静的な成果物」ではなく、
継続的に運用されるアプリケーションとして整理し直すためのものです。

今後も基盤の改善を続けながら、運用していきます。