React19 β をざっと見る - Speaker Deck

React19 β をざっと見る

by rakus frontend

Speaker Deck

Share

Embed

Start on current slide

Slide 1

Slide 1 text

React 19 Beta をざっと見る 2024/05/21　伊藤

Slide 2

Slide 2 text

新機能: アクション • useTransitionを使用して、送信中状態やエラー処理を簡単に管理。 • useActionStateとuseOptimisticによる楽観的更新のサポート。 • 例:

Slide 3

Slide 3 text

新しいフック: use • レンダリング中にリソースを読み取る新API。 • 例:

Slide 4

Slide 4 text

サーバコンポーネント • サーバ上で実行される非同期関数を呼び出せるサーバアクションの導入。 • サーバコンポーネントを使用してバンドル前にコンポーネントを事前レンダー。 • 詳細はReact Server Componentsを参照。

Slide 5

Slide 5 text

改善点: refのprops化 • 関数コンポーネントでrefに直接アクセス可能になった。 • forwordRefが不要になり、将来的に非推奨になる予定。 • 例:

Slide 6

Slide 6 text

コンテクストのプロバイダ • の代わりにを使用可能に。 • 例:

Slide 7

Slide 7 text

その他の改善 • refコールバックからクリーンアップ関数を返す機能。 • 例:

Slide 8

Slide 8 text

参考文献 https://ja.react.dev/blog/2024/04/25/react-19