一言で理解するReact Server Components

この記事はReact公式の内容を翻訳・紹介するものではありません。筆者の解釈や理解を伝えるものであり、Reactの公式見解と一致しているとは限りません。あらかじめご了承ください。 皆さんこんにちは。最近Next.js 13.4がリリースされ、App Routerがstable扱いになりました。App RouterはReact Server Component (RSC) をふんだんに用いて構築されています。 React本体でServer Componentがずっとalpha版なのにNext.jsでbetaとかstableとか言ってるのは何で？ という問題も、React Canaryのアナウンスにより無事に解消されました。 React Canaryってなに？ 先日React公式ブログでアナウンスされた、新しいリリースチャネルです。 筆者の理解による概要をお伝えすると、Canary版のReac

[tohokuaiki]

「サーバでやればコスト減！」という考え方がすごく不思議。C10K問題は？“一般にはstage 0に寄せたほうが転送量的に有利です。また、コンポーネントの処理が減るので実行時のパフォーマンス的にも有利になります。”

[surume000]

ややこしい

[tosi29]

React Server Componentsは多段階計算。できるだけサーバで計算しておき、できないものをクライアントコンポーネントとしている。

[youko03]

“最も自然なRSCの受容の仕方は、「とりあえず全部stage 1（クライアント用）にしておけば従来通り。そこにstage 0（Server Component）を足していく」というものになるでしょう。”

[cpw]

すごーく複雑だし、すごくこねくり回している感。システムはシンプルに保っておいた方が良いと考えているので、取り入れないほうが良さそうに思った。

[shingo-sasaki-0529]

これは世界観が頭に入ってきた面白かった。テンプレートエンジンとして扱われてしまっているコンポーネントを stage 0 としてサーバー側に移すことができるって話は腑に落ちた。

[diveintounlimit]

一言・・・？

[yhara]

phpも一種の多段階計算、確かに

[mayumayu_nimolove]

またすげえ難しい😓。一言じゃないし。

[dkanikama]

めちゃくちゃ面白かったし、シンプルな原則としてまとめてくれて助かった(公式未読なのでどこまで著者独自見解かは未確認)。nextjsやってみようと思えた。

[manaten]

わかりやすい。どこまで行ってもサーバークライアントモデルである以上、サーバー用クライアント用のコードは必要だが、従来のSSRだと境界が理解しづらかったもんなあ

[jay-es]

RSC は多段階計算で、従来の React アプリケーション（stage1）の前段に stage0 が追加されたと考える。なるべく RSC に寄せるのがパフォーマンス的に有利。SSR は stage1 をサーハーサイドで実行しているので混同してはいけない