App Router (RSC) の小さな利点

suzukenz
·

App Router (React Server Component) を使う場合に、コンポーネントの「どこまでが静的で、どこからが動的でなければならないのか」を強制的に意識させられる点が、利点の1つだなあと思いました。

前者はServer Component、後者はClient Componentとして扱われます。

例えば自分の記事をまとめたこちらのサイトについて。

参考サイト(suzukenz.dev)の画像

「何日前」の部分は、表示した時にわかる部分なので、このコンポーネントだけはClient Componentにする必要があります。

それ以外の部分は、全て静的なのでServer Componentにできます。

この辺がうまく切り分けられてると、キャッシュを活用したパフォーマンス向上などがやりやすいです。

といった具合のことをなんとなく思いついたので書いてみました。

終わり。

@suzukenz
こんにちは