皆さん、こんにちは。
今回は「React 19 の RC（Release Candidate）版」について紹介させていただきます。
React 19 の RC（Release Candidate）版は、正式リリース前の最終確認用パッケージとして公開されているテスト版です。実運用環境への導入前に、最新の新機能や破壊的変更が問題なく動作するかを確認するために使われます。
RC版のリリース日とバージョン
- RCフェーズ開始日：2024年5月15日頃に RC フェーズに移行しています。
- 主なパッケージバージョン例：
react@19.0.0-rc-6f23540c7d-20240528、react-dom@19.0.0-rc-6f23540c7d-20240528といったバージョンが NPM に公開されています。
インストール方法
# npm
npm install --save-exact react@^19.0.0-rc react-dom@^19.0.0-rc
# Yarn
yarn add --exact react@^19.0.0-rc react-dom@^19.0.0-rc
# TypeScript を使っている場合は型定義も更新
npm install --save-exact @types/react@^19.0.0-rc @types/react-dom@^19.0.0-rc
この手順は公式のアップグレードガイドにも記載されています。
主な新機能・変更点
Actions とトランジションの強化
-
useTransitionでasync関数を直接ラップし、保留中／エラー状態の管理を自動化 - フォーム向けに
<form action={…}>と組み合わせて使える新 API -
useOptimisticやReact.useActionStateによる楽観的 UI 更新サポート
サーバーコンポーネントの公式統合
- Next.js に先行実装されていた
Server ComponentsをReact本体に組み込み - コンポーネント内で
async/awaitが直接利用可能になり、初期ロード高速化や SEO 改善が期待できる
新しい JSX トランスフォーム必須化
- React 2020 年に導入されたモダン JSX トランスフォームが前提に
- 従来の
import React from 'react'を不要にしつつ、より高速なバンドル出力を実現
アップグレード手順
- まずは互換性チェック用に react@18.3 へアップグレードし、非推奨 API の警告を確認。
-
npx codemod@latest react/19/migration-recipeで提供されるcodemodを実行し、自動置換を適用。 - テストを通過したら、本番環境で RC を検証しつつ、フィードバックやバグ報告を行う。
注意点
- RC はあくまでテスト用の候補版（正式版ではない）ため、本番環境への早期導入はリスクがあります。
- 型定義
（@types/react）も合わせて RC 版に揃えないと、TypeScript でエラーになる場合がある点に注意してください。
React 19 RC 版の概要と導入ガイドです。正式リリース前に新機能を試したい場合はぜひ RC をインストールして動作検証できると思います。
新機能の恩恵を受けつつ、安定版リリースまでの開発をお楽しみください！
今日は以上です。
ありがとうございました。
よろしくお願いいたします。