Summary

React Conf 2021 では React 18 の RC 公開と、並行（concurrent）機能や Suspense を軸にした多プラットフォーム戦略が発表されました。今回のリリースは破壊的変更を避けつつ段階的に新機能を導入できる設計です。エンジニア向けにはアップグレード手順、Streaming SSR、DevTools の更新点、そして新しいフックの互換性確認が実務上の重要項目です。

Key Points

• React 18 RC が公開され、安定版は翌年に予定。段階的導入が可能で「Concurrent Mode」はなく、concurrent features を個別に採用。
• アップグレード手順（簡潔）:
  • 依存関係を更新: npm install react@rc react-dom@rc
  • 描画 API を切替: const root = ReactDOM.createRoot(container); root.render(<App />)
• Suspense と Streaming SSR により、サーバーから部分的にHTMLをストリームしつつ早期にコンテンツ表示・相互作用を可能に。
• 新しいフック（useId, useSyncExternalStore, useInsertionEffect）はライブラリ互換性に影響する可能性があるためテストが必須。
• React DevTools に新しい Timeline Profiler が追加。パフォーマンス計測とデバッグで早めに検証すること。
• Server Components や React Native の多プラットフォーム方針は継続的に進展予定。導入計画は段階的に評価を。

Actionable advice

• まずローカル/ステージングで react@rc を試し、既存ライブラリと新フックの互換性を確認する。
• Streaming SSR を検討するページで Suspense を使った分割レンダリングを試験的に導入し、First Contentful Paint と TTI を測定。
• DevTools の Timeline Profiler を使ってレンダリングや更新コストをプロファイルし、ボトルネックを洗い出す。

参考: React Conf の各トーク（キーノート・アップグレードデモ・Streaming SSR）で実装例と詳細な説明が公開されています。