React Conf 2025 (Day 1)

先週、2025年のReact Confが開催されました。

1日目は主にReactに関連するテーマで発表が行われました。

• React Keynote

  • React 19.1（Owner Stacks）、19.2（Activity/useEffectEvent/Partial Pre-rendering）、Canary（View Transitions）が発表
  • React Compiler 1.0を正式リリース、自動メモ化とコード解析を提供
  • React Foundationの設立により、コミュニティ中心のガバナンスを開始

• View Transitions and Activity

  • <Activity />でstateのlift-upなしにvisible/hidden状態を切り替え、stateを自動保存
  • <ViewTransition />により、Server Componentsでも宣言的なアニメーションを実装
  • UI状態管理とアニメーションをcomposableかつdeclarativeに処理

• Profiling with React Performance Tracks

  • React 19.2からChrome DevToolsでReactの処理タイムラインの可視化をサポート
  • Scheduler/Components/Server Components Trackで性能ボトルネックを把握
  • Suspense Panelの追加によりSuspense boundaryの状態を可視化（2025年末リリース）

• In case you missed the memo

  • Sanity StudioはReact Compilerにより1,000個以上のコンポーネントをmemoizeし、平均20〜30%の性能向上
  • 細かな最適化（contextの条件付き購読、branch memoization）やバグ検出が可能
  • すぐに導入し、メモ化を気にせず "Make it work" に集中することを推奨

• Async React

  • Transitions、Suspense、Server Componentsは非同期アプリ構築のための新しい構造
  • Suspense、router、cachingでloading stateのちらつきを解消
  • startTransitionとアニメーションの統合により、data fetchingとUI updatingを調整

• React and AI

  • MetaはAIをバグ修正やコード探索に活用し、LLM rulesでコンテキストを注入
  • 正しいcontextの特定に注力し、AIをペアプログラミングのパートナーとして活用
  • Reactのstable APIはAIツール構築の基盤であり、AI Engineerへのキャリア転換の機会

• Exploring React Performance

  • Data ModelとRendering Algorithmのバランスが重要で、React Compilerが性能を改善
  • Domain-specificなアプローチは一般的な増分アルゴリズムより優れている
  • Transitions、Suspense、Virtualization、<Activity />とData Modelingを活用

• The invisible craft of great UX

  • クリック・ドラッグ・ドロップ、OSごとのポップオーバー、ツールチップ遅延などの小さなディテールがUXに大きく影響
  • DOMイベントではなくユーザーの意図を解釈し、スクラブカーソルの固定・瞬間移動で問題を解決
  • 複数のポップオーバーを単一要素として再利用し、性能を向上（300個→1個）

• Building an MCP Server for a React Component

  • MCPはAIと外部システムをつなぐオープンソース標準で、USB-Cのような標準化された方式を提供
  • AG Gridは36万件のドキュメントを埋め込み、Postgresに保存してLLMへ正確なコンテキストを提供
  • Prompts/Resources/Toolsでドキュメント検索と高速なコンポーネント生成を支援

• Why React Native apps make all the money

  • React Nativeは有料転換率、インストール当たりの収益、LTVで優れた成果
  • クロスプラットフォーム開発により迅速なリリースと一貫した収益化戦略を適用
  • RevenueCat SDKでペイウォール、分析、価格実験など簡単な収益化を支援

• Modern emails using React

  • メールはCSSプロパティの非対応やクライアントごとのレンダリング差異により開発が難しい
  • React Emailはコンポーネントベースの作成、互換性テスト、リンク検査などを支援
  • Render関数でHTMLに変換し、Resend APIは主要企業で利用中

• React team Q&A

  • React CompilerはRules of Reactを守れば安全に導入でき、新しいコードではuseMemo/useCallbackは不要
  • AIはペアプログラミングのパートナーとして活用し、アーキテクチャ設計能力が重要
  • React Foundationにより今後5年間でMetaの役割を縮小し、コミュニティ拡大と親しみやすい雰囲気を求める

[nayounsang1]

ありがとうございます

[soaple]

ありがとうございます！

[bluekai17]

React Native 0.82 のアップデート内容もかなり充実していましたね

[soaple]

はい、その通りです（笑）

React Native 関連の発表はほとんどが2日目に行われたため、以下の2日目の発表内容をご覧いただくと参考になると思います！

https://ja.news.hada.io/topic?id=23670

[addons]

ありがとうございます。とてもよく拝見しました！

[soaple]

ありがとうございます！

[soaple]

発表内容がかなり長いため、全体の内容が気になる方はリンク先の文章を参考にするとよさそうです。

2日目の発表内容も近いうちに整理して投稿したいと思います！