はじめに
Reactは、2024年12月にリリースされたバージョン19（以下「React 19」）において、非同期処理に関して大きな進化を遂げました。ReactはMeta社（旧Facebook）とオープンソースコミュニティによって開発されており、動的なWebページのインターフェースを構築するためのJavaScriptライブラリーです。
2022年3月にリリースされた前バージョンReact 18では、「並行レンダリング」や「トランジション」「Suspenseの拡充」など、どちらかというとレンダリング性能の改善にフォーカスしたものが多かったのに対し、React 19では「非同期処理」、特に「フォーム送信」や「データ更新」にフォーカスしているようです。
React 19の概要は、公式ブログ記事で紹介されています。
本記事では、React 19の新機能のうち、新しい概念である「アクション」に関するものを紹介していきます。
対象読者
- 新バージョンでReactを体験してみたい方
- すでにReact開発に従事していて、新機能を知りたい方
- Reactの最新動向を追っておきたい方
なお、本記事はReact 18で導入された「トランジション」や「Suspense」に関して基本知識があることを前提としています。
前提環境
本記事のサンプルコードは、以下の環境で動作を確認しています。
- Ubuntu 22.04
- React 19.0.0
- Node.js v22.7.0
- Google Chrome 130.0.6723.92
サンプルコードを実行するには、サンプルのフォルダーでnpm installコマンドを実行してライブラリーをダウンロード後、npm startコマンドを実行し、https://localhost:3000をWebブラウザーで表示します。本記事内ではReact 19の新機能に関する本質的な部分を抽出して説明するので、それ以外の実装は各サンプルコードを参照してください。
