React Native 0.80 - React 19.1、JS APIの変更、レガシーアーキテクチャの凍結など

本日、React Native 0.80のリリースを発表できることを嬉しく思います！

このリリースにより、React Nativeに同梱されるReactのバージョンが最新の安定版である19.1.0になります。

また、JS APIの安定性を向上させるための一連の改善も行っています。ディープインポートには警告が表示されるようになり、より正確で安全に使用できる型を提供する新しいオプトインのStrict TypeScript APIを提供します。

さらに、React Nativeのレガシーアーキテクチャは正式に凍結され、レガシーアーキテクチャが完全に廃止された際に機能しなくなるAPIに対して警告が表示されるようになります。

ハイライト

• JavaScriptディープインポートの非推奨化
• レガシーアーキテクチャの凍結と警告
• React 19.1.0
• 実験的 - React NativeのiOS依存関係がプリビルドされるようになりました

ハイライト

JavaScriptのディープインポートの非推奨化

このリリースでは、React Native の公開 JavaScript API の改善と安定化に向けた取り組みを行っています。その第一歩として、アプリやフレームワークでインポート可能な API のスコープをより明確にしています。これに伴い、React Native からのディープインポートを正式に非推奨とし（RFC参照）、ESLint と JS コンソールを介して警告を導入しています。

これらの警告は、プロジェクトのソースコード内からのインポートにスコープされており、オプトアウトできます。ただし、将来のリリースで React Native の API からディープインポートを削除することを目指しており、これらは代わりにルートインポートに更新する必要があることに留意してください。

// Before - import from subpath
import {Alert} from 'react-native/Libraries/Alert/Alert';

// After - import from `react-native`
import {Alert} from 'react-native';

一部の API はルートでエクスポートされておらず、ディープインポートなしでは利用できなくなります。これは、React Native の API の全体的な表面積を減らすための意図的なものです。ユーザーの問題についてはオープンなフィードバックスレッドがあり、少なくとも次の2つの React Native リリースでエクスポートする API を最終決定するためにコミュニティと協力していきます。ぜひフィードバックを共有してください！

この変更の詳細については、専用の投稿をご覧ください: 安定したJavaScript APIへの移行。

Opt-in Strict TypeScript API

上記の公開APIのエクスポートの再定義に伴い、0.80では`react-native`パッケージ用の新しいTypeScript型セットも提供します。これを「Strict TypeScript API」と呼んでいます。

Strict TypeScript APIへのオプトインは、React Nativeの将来の安定したJavaScript APIのプレビューです。これらの新しい型は、

1. ソースコードから直接生成されます — カバレッジと正確性を向上させ、より強力な互換性保証を期待できます。
2. React Nativeのインデックスファイルに制限されます — 公開APIをより厳密に定義し、内部ファイル変更時にAPIを破壊しないことを意味します。

これらは既存の型と並行して提供されるため、準備ができたときに移行を選択できます。また、標準のReact Native APIを使用している場合、多くのアプリは変更なしで検証できるはずです。早期採用者や新しく作成されたアプリには、`tsconfig.json`ファイル経由でオプトインすることを強くお勧めします。

コミュニティの準備が整い次第、Strict TypeScript APIは将来のデフォルトAPIとなり、ディープインポートの削除と同期されます。

この変更の詳細については、専用の投稿をご覧ください: 安定したJavaScript APIへの移行。

レガシーアーキテクチャの凍結と警告

React Nativeの新しいアーキテクチャはバージョン0.76からデフォルトの選択肢となっており、私たちはその恩恵を大いに受けているプロジェクトやツールの成功事例を読んでいます。

最近共有したように、レガシーアーキテクチャは凍結されたと見なしています。レガシーアーキテクチャでは、新たなバグ修正や機能開発は行われなくなり、リリース作業中にレガシーアーキテクチャのテストは停止します。

移行をスムーズにするため、バグやリグレッションが発生している場合は、引き続き新しいアーキテクチャをオプトアウトすることを許可しています。

しかし、React Nativeで2つのアーキテクチャをサポートすることは、実行時のパフォーマンス、アプリのサイズ、およびコードベースのメンテナンスに影響を与える大きな課題です。

そのため、将来的にはレガシーアーキテクチャを段階的に廃止する必要があります。

0.80では、新しいアーキテクチャでは動作しないAPIを使用している場合に警告を発する一連の警告をReact Native DevToolsに追加しました。

これらの警告を無視せず、将来に備えてアプリとライブラリを新しいアーキテクチャに移行することを検討することをお勧めします。

これらの変更の詳細については、App.jsで最近発表された「Life After Legacy: The New Architecture Future」という講演で学ぶことができます。

React 19.1.0

このReact Nativeのリリースには、最新のReact安定版である19.1.0が含まれています。

React 19.1.0で導入されたすべての新機能とバグ修正については、リリース説明を参照してください。

警告

React 19.1.0の注目すべき機能の1つは、owner stacksの実装と改善です。これは開発専用機能であり、特定のエラーの原因となっているコンポーネントを特定するのに役立ちます。

ただし、React Native Babel Presetでデフォルトで有効になっている`@babel/plugin-transform-function-name` Babelプラグインを使用している場合、React Nativeでowner stacksが期待どおりに動作しないことがわかっています。これに対する修正は、React Nativeの将来のリリースで提供される予定です。

実験的 - React Native iOSの依存関係が事前ビルドされるようになりました

React Native iOSアプリをビルドしている場合、最初のネイティブビルドには時間がかかることにお気づきでしょう。古いマシンでは数分、あるいはそれ以上かかることもあります。これは、React Native iOSコード全体とそのすべての依存関係をコンパイルする必要があるためです。

ここ数週間、私たちはAndroidの場合と同様に、React NativeのiOS向けコアの一部を事前ビルドすることで、React Nativeアプリを最初に実行する際のビルド時間を短縮する実験を行ってきました。

React Native 0.80は、React NativeのiOS向けの一部を事前ビルドとして提供し、ビルド時間の短縮に役立つ最初のリリースです。

React Nativeのリリースプロセス中に、React Nativeが依存するサードパーティの依存関係のみを事前ビルドした`ReactNativeDependencies.xcframework`というXCFrameworkを生成しています。

このiOS向けの最初の事前ビルドでどれだけの時間が節約されるかを実験し、ベンチマークを行いました。M4マシンで実行したベンチマークでは、iOSビルドはソースからビルドするよりも事前ビルドを使用した場合の方が約12%高速でした。

私たちの経験から、ユーザーからのバグレポートのいくつかで、React Nativeのサードパーティ依存関係に関連するビルド問題が原因となっているものがあることも確認しています（例：#39568）。サードパーティ依存関係を事前ビルドすることで、それらを私たちの方でビルドできるため、ユーザーはこれらのビルド問題に直面することがなくなります。

React Native全体を事前ビルドしているわけではありません。FollyやGLogなど、Metaが直接管理していないライブラリのみを事前ビルドしています。

将来のリリースでは、残りのReact Nativeコアも事前ビルドとして提供する予定です。

使用方法

この機能はまだ実験段階であるため、デフォルトではオンになっていません。

これらを使用したい場合は、`RCT_USE_RN_DEP`環境変数を追加してポッドをインストールできます。

RCT_USE_RN_DEP=1 bundle exec pod install

あるいは、すべての開発者が使用できるようにしたい場合は、Podfileを次のように変更できます。

if linkage != nil
  Pod::UI.puts "Configuring Pod with #{linkage}ally linked Frameworks".green
  use_frameworks! :linkage => linkage.to_sym
end

+ENV['RCT_USE_RN_DEP'] = '1'

target 'HelloWorld' do
  config = use_native_modules!

事前ビルドがあなたやあなたのアプリに引き起こす可能性のある問題については、このディスカッションで報告してください。私たちはそれらを調査し、その使用があなたのアプリに対して透過的であることを確認することに尽力します。

その他の変更点

Android - IPOによりAPKサイズが縮小

このリリースでは、React NativeでビルドされたすべてのAndroidアプリのサイズが大幅に削減されます。0.80から、React NativeとHermesの両方のビルドでプロシージャ間最適化を有効にしました。

これにより、すべてのAndroidアプリで約1MBの容量が削減されました。

React Nativeのバージョンを0.80に更新するだけで、このサイズ削減の恩恵を受けることができ、プロジェクトにこれ以上の変更は必要ありません。

新しいアプリ画面の再設計

Expoを使用していないが、コミュニティCLI & テンプレートを使用している場合、このバージョンでは新しいアプリ画面を独自のパッケージに移動し、デザインを一新しました。これにより、コミュニティテンプレートで新しいアプリを作成する際の初期コードのボイラープレートが削減され、より大きな画面で表示されたときのユーザーエクスペリエンスも向上します。

JSCコミュニティサポートに関する注意

React Native 0.80は、ファーストパーティのJSCサポートを提供する最後のバージョンです。JSCのサポートは、コミュニティが維持するパッケージ`@react-native-community/javascriptcore`を通じて提供されます。

お知らせを見逃した場合は、こちらで詳細をお読みください

破壊的変更

メインパッケージに`"exports"`フィールドを追加

JS安定版APIの変更の一環として、`react-native`の`package.json`マニフェストに`"exports"`フィールドを導入しました。

0.80では、このマッピングはデフォルトですべてのJavaScriptサブパスを引き続き公開するため、大きな破壊的変更にはならないはずです。同時に、これは`react-native`パッケージ内のモジュールが解決される方法に微妙な影響を与える可能性があります。

• Metroでは、プラットフォーム固有の拡張機能は`"exports"`の一致に対して自動的に展開されません。これに対応するために、多数のshimモジュールが提供されています（#50426）。
• Jestでは、ディープインポートのモック機能が変更される可能性があり、テストの更新が必要になる場合があります。

その他の破壊的変更

このリストには、製品コードに軽微な影響を与える可能性があり、注目すべきその他の破壊的変更がいくつか含まれています。

JS

• `eslint-plugin-react-hooks`がv4.6.0からv5.2.0にバージョンアップされました（完全な変更履歴はこちら）。`react-hooks`リントルールは新しいエラーシグナルを生成する可能性があり、修正または抑制する必要があります。

Android

• このリリースでは、React Nativeに同梱されるKotlinのバージョンが2.1.20に上がります。Kotlin 2.1では、プレビューで新しい言語機能が導入されており、モジュールやコンポーネントで使い始めることができます。詳細については、公式リリースノートで確認できます。
• `StandardCharsets`クラスは削除されました。0.73以降非推奨となっていました。代わりに`java.nio.charset.StandardCharsets`クラスを使用してください。
• いくつかのクラスを内部化しました。これらのクラスは公開APIの一部ではなく、アクセスすべきではありません。影響を受けるライブラリには既に通知またはパッチを提出済みです。
  • com.facebook.react.fabric.StateWrapperImpl
  • com.facebook.react.modules.core.ChoreographerCompat
  • com.facebook.react.modules.common.ModuleDataCleaner
• いくつかのクラスをJavaからKotlinに移行しました。これらのクラスを使用している場合、一部のパラメータのnull許容性や型が変更されたため、コードを調整する必要があるかもしれません。
  • com.facebook.react.devsupport内のすべてのクラス
  • com.facebook.react.bridge.ColorPropConverter
  • com.facebook.react.views.textinput.ReactEditText
  • com.facebook.react.views.textinput.ReactTextInputManager

iOS

• RCTUtils.hから`RCTFloorPixelValue`フィールドを削除しました。`RCTFloorPixelValue`メソッドはReact Nativeで使用されていなかったため、完全に削除されました。

その他の軽微な破壊的変更は、0.80の変更ログに記載されています。

謝辞

React Native 0.80には、127人のコントリビューターによる1167以上のコミットが含まれています。皆様の多大なご尽力に感謝いたします！

このリリースに多大な貢献をしてくださったコミュニティメンバーの方々に、特に感謝の意を表します。

• React Native DependenciesのiOS事前ビルドに関する作業を行ったChristian Falch氏
• Strict TypeScript APIの作業を行ったIwo Plaza氏、Jakub Piasecki氏、およびDawid Małecki氏。

さらに、このリリース記事で機能の文書化に協力してくれた追加の著者にも感謝いたします。

• React Native DependenciesのiOS事前ビルドに関する部分を執筆したRiccardo Cipolleschi氏。
• ディープインポートの非推奨化、Opt-in Strict TypeScript API、新しいアプリ画面の再設計を担当したAlex Hunt氏。
• レガシーアーキテクチャの凍結と警告を担当したNicola Corti氏。

0.80へのアップグレード

既存のプロジェクトにおけるReact Nativeのバージョン間のコード変更を確認するには、アップグレードドキュメントに加えて、React Nativeアップグレードヘルパーを使用してください。

新しいプロジェクトを作成するには

Expoをご利用の場合、React Native 0.80はExpo SDKのカナリアリリースでサポートされます。ExpoでReact Native 0.80を使用する方法については、専用のブログ記事でも説明しています。

情報

0.80はReact Nativeの最新安定版となり、0.77.xはサポート対象外となります。詳細については、React Nativeのサポートポリシーをご覧ください。0.77の最終的なサポート終了アップデートを近いうちに公開する予定です。