Upgrade to Pro — share decks privately, control downloads, hide ads and more …

React19 β をざっと見る

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for rakus frontend rakus frontend
May 23, 2024
Technology
350
0

React19 β をざっと見る

Avatar for rakus frontend

rakus frontend

May 23, 2024

More Decks by rakus frontend

See All by rakus frontend
新卒FEが1年目に取り組んだこと・学んだこと
Avatar for rakus frontend rakus_fe
0
54
ErrorBoundaryとSuspenseの導入検討
Avatar for rakus frontend rakus_fe
1
800
日付をもう少し真面目に勉強中
Avatar for rakus frontend rakus_fe
0
51
Reactのパフォーマンス改善例
Avatar for rakus frontend rakus_fe
0
560
Typescript5.4の新機能
Avatar for rakus frontend rakus_fe
0
330
非破壊的な配列メソッド
Avatar for rakus frontend rakus_fe
0
400
ココがすごいぜ！Playwright Component Test
Avatar for rakus frontend rakus_fe
0
600
スプレッドシートのセル結合がつらいので足掻いてみた話
Avatar for rakus frontend rakus_fe
0
280

Other Decks in Technology

See All in Technology
建設的な現実逃避のしかた / How to practice constructive escapism
Avatar for Pauli pauli
4
310
バックオフィスPJのPjMをコーポレートITが担うとうまくいく3つの理由
Avatar for chama yueda256
1
300
さくらのクラウドでつくるCloudNative Daysのオブザーバビリティ基盤
Avatar for Taisuke Okamoto a.k.a BigBaBy b1gb4by
0
150
ASTのGitHub CopilotとCopilot CLIの現在地をお話しします/How AST Operates GitHub Copilot and Copilot CLI
Avatar for AEON aeonpeople
1
220
試されDATA SAPPORO [LT]Claude Codeで「ゆっくりデータ分析」
Avatar for Satoru Ishikawa ishikawa_satoru
0
360
サイバーフィジカル社会とは何か / What Is a Cyber-Physical Society?
Avatar for Kenji Saito ks91
PRO
0
160
20260410 - CNTUG meetup #72 - DiskImage Builder 介紹：以 Kubespray CI 打造 RockyLinux 10 Cloud Image 為例
Avatar for ChengHao Yang tico88612
0
120
ADOTで始めるサーバレスアーキテクチャのオブザーバビリティ
Avatar for Ryotaro Harada alchemy1115
2
270
Strands Agents × Amazon Bedrock AgentCoreで パーソナルAIエージェントを作ろう
Avatar for yoko / Naoki Yokomachi yokomachi
2
270
🀄️ on swiftc
Avatar for giginet giginet
PRO
0
320
60分で学ぶ最新Webフロントエンド
Avatar for mizdra mizdra
PRO
7
2.8k
研究開発部メンバーの働き⽅ / Sansan R&D Profile
Avatar for Sansan, Inc. sansan33
PRO
4
23k

Featured

See All Featured
Redefining SEO in the New Era of Traffic Generation
Avatar for Szymon Słowik szymonslowik
1
270
Groundhog Day: Seeking Process in Gaming for Health
Avatar for Sebastian Deterding codingconduct
0
140
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
Avatar for David Carrasco davidcarrasco
3
110
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
Avatar for Sophie Logan marketingsoph
0
120
The Language of Interfaces
Avatar for Des Traynor destraynor
162
26k
Test your architecture with Archunit
Avatar for Yoan thirion
1
2.2k
A Soul's Torment
Avatar for Nat Ma seathinner
6
2.6k
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
1
1.1k
Leveraging Curiosity to Care for An Aging Population
Avatar for Cassini Nazir cassininazir
1
210
Deep Space Network (abreviated)
Avatar for Tony Rice tonyrice
0
110
New Earth Scene 8
Avatar for Sydney Stone popppiees
3
2k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1.3k

Transcript

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

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

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

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

    Componentsを参照。

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

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

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

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