OpenAIReact NativeJun 11, 2026, 12:00 AM

React Native 0.86 - Edge-to-Edge and DevTools Improvements, no breaking changes

A condensed section focused on the key takeaways first.

Original Post

Quick Digest

Summary

A condensed section focused on the key takeaways first.

openaienmodel: gpt-5-mini-2025-08-07

React Native 0.86 - Edge-to-Edge and DevTools Improvements, no breaking changes

Key Points

  • Edge-to-edge fixes for Android 15+
  • DevTools light/dark emulation via Emulation.setEmulatedMedia
  • No user-facing breaking changes (upgrade-safe)

Summary

React Native 0.86 focuses on robust edge-to-edge support for Android (including Android 15+), improvements to React Native DevTools emulation, infrastructure moves, JSI additions, and a range of runtime, layout, accessibility and Android-specific fixes. This release declares no user-facing breaking changes, so most projects can upgrade without code changes.

Key Points

  • Edge-to-edge (Android 15+): comprehensive fixes including correct measureInWindow coordinates, KeyboardAvoidingView behavior, accurate Dimensions window values, StatusBar updates while Modal is open, and navigation bar contrast respecting enforceNavigationBarContrast.
  • DevTools: supports light/dark mode emulation via Emulation.setEmulatedMedia (open via cmd/ctrl + shift + P); the emulation is temporary and resets when DevTools disconnects.
  • Repository move: React Native (and related repos) moved to the react GitHub organization; redirects are automatic.
  • No user-facing breaking changes: upgrading from 0.85 should not require app code changes; consult the Upgrade Helper and Upgrading docs for diffs.
  • Deprecations: ViewUtil.getUIManagerType and the second arg of AppRegistry.setComponentProviderInstrumentationHook are deprecated and will be removed in a future release.
  • JSI/Native interface: new APIs (IRuntime exposure, typed arrays/Uint8Array, ArrayBuffer.detached, Array.push, String.length, isInteger, and JS error factory APIs) improve native↔JS capabilities.
  • Rendering/layout fixes: Modal style now forwarded to inner container, native animated mounting sync fixes flicker, text-measure crash fixed, non-invertible transforms excluded from hit-testing, and several Yoga layout bug fixes.
  • Android and platform fixes: BackHandler now includes native timeStamp and properly re-registers on resume (API 36+), LogBox/RedBox dismissible with back button, TextInput IME height and Samsung auto-capitalize fixes, Image.getSize returns true source dims, WebSocket preserves Cookie headers, and NetworkingModule handles large responses without OOM.
  • Infrastructure: Metro updated (^0.84.2), HeadlessJsTaskSupportModule auto-registered in CoreReactPackage, and PerformanceObserver default durationThreshold aligned to 104ms per the web spec.

Upgrade Notes

  • This release is marked upgrade-safe with no user-facing breaking changes. Use the React Native Upgrade Helper to review diffs for your project.
  • New features and deprecations may require code updates later; remove usages of deprecated APIs ahead of future releases.

Where to look next

  • Upgrade Helper and Upgrading docs for step-by-step upgrade guidance.
  • DevTools: open Command Palette (cmd/ctrl + shift + P) to test light/dark emulation.
  • Release changelog for full list of fixes and contributor acknowledgements.

Full Translation

Translations

A translation section that keeps the flow of the original article.

openaijamodel: gpt-5-mini-2025-08-07

React Native 0.86 — Edge-to-Edge と DevTools の改善、ユーザー向け破壊的変更なし

公開日: 2026-06-11T00:00:00.000Z

著者: Fabrizio Cucci (Software Engineer @ Meta), Rob Hogan (Software Engineer @ Meta), Mathieu Acthernoene (Software Engineer @ Expo), Gabriel Donadel Dall'Agnol (Software Engineer @ Expo)

本日、React Native 0.86 をリリースしました!このリリースには Android 15+ における包括的な edge-to-edge サポートと、React Native DevTools の改善が含まれます。0.83 に続き、本リリースもユーザー向けの破壊的変更がない 2 回目のリリースであり、アップグレードの予測可能性とシームレスさを高める取り組みを反映しています。

ハイライト

  • 新しい移管先: React Native のリポジトリ移動
  • Android の Edge-to-Edge 対応の強化
  • React Native DevTools の改善

新しい移管先: React Native のホーム

React Native リポジトリは、React、Metro、Yoga、React Native Website とともに facebook GitHub 組織から react 組織へ移動しました。この移動は、React と React Native が React Foundation(React エコシステムの長期的な管理を目的とした独立財団)へ移行したことを反映しています。GitHub は既存の URL、Issue、PR を自動的に新しい場所へリダイレクトするため、ユーザー側での対応は不要です。

Android の Edge-to-Edge

React Native 0.86 は、OS 側で edge-to-edge が強制されている場合(edgeToEdgeEnabled Gradle プロパティで明示的に有効化されていない場合も含む)を含め、Android 15+ の edge-to-edge モードに関する包括的な修正を提供します。主な修正点:

  • measureInWindow が、edge-to-edge 有効時に正しい座標を返すようになりました。
  • KeyboardAvoidingView が Android 15+ で edgeToEdgeEnabled 時に正しく動作します。
  • Dimensionswindow 値が、edge-to-edge 有効時でも Android 15 より前のバージョンで正確になります。
  • StatusBarModal が開いている間でもステータスバーのスタイルと可視性を更新できるようになりました。
  • ナビゲーションバーのコントラストがテーマの enforceNavigationBarContrast 属性を尊重します。

React Native DevTools の改善

React Native DevTools は Emulation.setEmulatedMedia を使ったライト/ダークモードのエミュレーションをサポートするようになりました。これにより、デバイス設定を変えずに DevTools から直接アプリの表示モードをテストできます。コマンドパレットは cmd / ctrl + shift + P で開けます。Web と同様、この切り替えは一時的で、DevTools の切断時にリセットされます。

破壊的変更

React Native 0.86 にはユーザー向けの破壊的変更はありません。React Native 0.85 をご利用の場合、アプリコードを変更することなく 0.86 にアップグレードできるはずです。破壊的変更の定義については「this article」を参照してください。

非推奨 (Deprecations)

以下の API は非推奨となり、将来のリリースで削除される予定です:

  • ViewUtil.getUIManagerType: レガシーアーキテクチャの削除の一環として非推奨です。UIManagerType.Fabric を直接インライン化するか、UIManagerType のチェックを削除してください。
  • AppRegistry: AppRegistry.setComponentProviderInstrumentationHook の 2 番目の引数が非推奨になり、使用すると警告が出ます。

その他の変更

実行時 & Web 規格の整合

  • ExceptionsManager.reportErrorsAsExceptions の厳格化: reportErrorsAsExceptionsfalse 以外を設定しても効果がなくなりました。以前は 0null"" のような偽値がエラー→例外変換を無効化していましたが、今後は明示的なブール値 false のみがオプトアウトとして扱われます。これにより API の誤使用に強くなります。
  • PerformanceObserver のデフォルト durationThreshold: observe({type: 'event'}) が W3C Event Timing 仕様に沿って durationThreshold をデフォルトで 104ms に設定するようになりました(すべてのイベントを報告しなくなります)。これにより React Native の Performance API が Web 標準と整合し、非常に短いイベントによるノイズが減ります。

レンダリング、レイアウト & アニメーション

  • Modal コンポーネントの style プロップ: styleModal の内部コンテナ View にフォワードされるようになり、透過や backdropColor の挙動を壊すことなくパディングや背景色などをカスタムできます。
  • Animated マウントレイヤーの同期: ネイティブ Animated の同期更新が後続の React コミットで上書きされないようにマウントレイヤー同期を有効化しました。これによりアニメーションが一瞬だけ元の値に戻るフリッカを修正しています。
  • テキスト測定のクラッシュ: すでに停止されたサーフェスでテキストを測定した際のクラッシュを修正しました。
  • 非可逆変換時のタッチ修正: scaleX: 0scaleY: 0 のような非可逆な transform を持つ View は、Android と iOS でタッチを受けなくなりました。ヒットテストで変換行列が逆行列を持たないことを検出してこれらの View をスキップします。
  • Yoga レイアウト修正: 絶対配置要素のテキスト折り返し(Android、#56651)、負の幅での BoringLayout.isBoring() によるクラッシュ(#56007)、display: contents ノードの所有権に関する修正(#56422)など、いくつかのレイアウト回帰を修正しました。

アクセシビリティ

  • 未解決の Promise: AccessibilityInfo.isDarkerSystemColorsEnabledisHighTextContrastEnabledprefersCrossFadeTransitions が未サポートプラットフォームで解決されないままになる問題を修正しました。これらは無限に保留されるのではなく、false に解決されます。

インフラ & 依存関係

  • Metro ^0.84.2: Metro バンドラ依存を更新しました。
  • HeadlessJsTaskSupportModule の自動登録: このモジュールは CoreReactPackage に登録されるようになったため、Android で headless JS タスクを使用するアプリは手動登録の必要がなくなりました。

JSI (Native Interface)

ネイティブモジュールと JS エンジン間の C++ インターフェース拡張:

  • IRuntime インターフェース: これまで protected だった Runtime メソッドを public にし、カスケードするインターフェースバージョンを作らずに新しい JSI 機能を可能にします。
  • TypedArray / Uint8Array: 型付き配列のファーストクラスサポート(作成、バッファアクセス、オフセット、長さの問い合わせ)。
  • ArrayBuffer.detached: ArrayBuffer がデタッチされているかをチェックするAPI。
  • Array.push: 配列に要素を追加できるようになりました(以前は作成後に配列サイズが不変でした)。
  • String.length: 文字列を完全な JS 文字列に変換せずに UTF-16 コード単位で長さを取得。
  • isInteger: jsi::Value が整数かどうかをランタイムに入らずにチェック。
  • エラー作成 API: TypeErrorRangeErrorReferenceErrorSyntaxErrorEvalErrorURIError のためのファクトリメソッド。

Android 入力、ナビゲーション、画像

  • BackHandler イベントオブジェクト: hardwareBackPress イベントはネイティブイベントからの timeStamp プロパティを含むイベントオブジェクトを渡すようになり、タイミング解析やイベント相関が可能になりました。引数を無視する既存のコールバックには影響しません。
  • API 36+ の resume 修正: Android API 36+ でアプリがバックグラウンドから復帰した際に BackHandler コールバックが動作しなくなる問題を修正しました。onHostResume 中にバックボタンハンドラが正しく再登録されます。
  • LogBox/RedBox のバックボタンによる消去: LogBox の通知トーストやインスペクタオーバーレイが Android のハードウェアバックボタンで閉じられるようになりました。
  • TextInput.setAutoCapitalize Samsung 修正: Samsung キーボード上で TYPE_NUMBER_FLAG_SIGNEDTYPE_NUMBER_FLAG_DECIMAL フラグが剥がされ、数値入力でマイナス記号が入力できなくなる問題を修正しました。
  • TextInput/KeyboardAvoidingView の IME 高さ: キーボードと絵文字パネルの切替や予測テキストバーの表示時などの IME 高さの変化に対して、KeyboardAvoidingViewTextInput の自動スクロールが正しく反応するようになりました。
  • Pressableandroid_ripple: android_ripple プロップが PlatformColor を受け入れるようになりました。
  • Image.getSize / Image.getSizeWithHeaders: これらは現在 Fresco のダウンサンプリング値ではなく、元のソースの実際の寸法を返します。

Android ネットワーキング

  • OutOfMemoryError ハンドリング: NetworkingModule が非常に大きな HTTP レスポンスを正しく処理し、OOM やクラッシュを引き起こさないようになりました。
  • WebSocket の Cookie ヘッダ: WebSocketModuleWebSocket コンストラクタの headers オプションで渡された Cookie ヘッダを削除しなくなり、認証クッキーを WebSocket 接続で送信できるようになりました。
  • New Architecture と Blob content provider: blob: URL を使ってバイナリデータにアクセスする Blob content provider が New Architecture でも正しく動作するようになりました。

謝辞

React Native 0.86 は 97 人の貢献者による 596 以上のコミットを含んでいます。皆さんのご尽力に感謝します。特に本リリースで大きな貢献をしてくださったコミュニティメンバーに感謝します:

  • Mathieu Acthernoene — Android の edge-to-edge サポートと StatusBar の改善
  • Jakub Piasecki — ShadowTree と Yoga の修正
  • Nick Gerleman — テキストレンダリングの修正
  • Peter Abbondanzo — LogBox、ScrollView、Image の修正

0.86 へのアップグレード

0.86 は現在 React Native の最新の安定版であり、0.83.x はサポート対象外になります。詳細は React Native のサポートポリシー を参照してください。

アップグレード方法

既存プロジェクト間のコード変更を確認するには、React Native Upgrade Helper と Upgrading ドキュメントを使用してください。

新規プロジェクトの作成

npx @react-native-community/cli@latest init MyProject --version latest

Expo

Expo プロジェクトでは、React Native 0.86 は expo@canary リリースの一部として利用可能になります。

タグ: announcement release

React Native 0.86 - Edge-to-Edge and DevTools Improvements, no breaking changes | React Native | DocsDigest