DocsDigest
Back to listLanguage: JA
ClaudeReact NativeDec 6, 2023, 12:00 AM

React Native 0.73 - Debugging Improvements, Stable Symlink Support, and more

A condensed section focused on the key takeaways first.

Original Post
OpenAIClaude

Quick Digest

Summary

A condensed section focused on the key takeaways first.

claudeenmodel: claude-sonnet-4-20250514

React Native 0.73 - Debugging Improvements, Stable Symlink Support, and Android Updates

react-nativedebugginghermesandroid-14kotlinsymlinksmetrobridgeless

Key Points

  • Hermes console log history and experimental new debugger
  • Stable symlink support in Metro for monorepo workflows
  • Android 14 support with Kotlin templates and Java 17 requirement

Summary

React Native 0.73 introduces significant debugging improvements, stable symlink support in Metro, and comprehensive Android updates including Android 14 support and Kotlin templates. The release also advances the New Architecture with Bridgeless Mode while deprecating legacy debugging features.

Key Points

Debugging Enhancements

  • Console Log History: Hermes now captures all console.log() calls in background, available when debugger connects
  • Experimental New Debugger: Technical preview of new JavaScript debugger to replace Flipper
  • Updated Documentation: Refreshed debugging docs with current information

Development Experience

  • Stable Symlink Support: Metro now resolves symlinks by default, enabling monorepo setups with Fast Refresh support
  • Kotlin Template: Android template now uses Kotlin instead of Java (36% smaller files)

Android Updates

  • Android 14 Support: Full support for API Level 34 (Upside Down Cake)
  • Java 17 Requirement: Updated Android Gradle Plugin to 8.1.x requires Java 17
  • Selected Photos Access: Support for READ_MEDIA_VISUAL_USER_SELECTED permission
  • Min SDK Notice: Final version supporting Android 5.0 (API 21)

New Architecture

  • Bridgeless Mode: Experimental mode that completely disables the bridge
  • Native Module Interop Layer: Allows reusing old modules in Bridgeless Mode

Breaking Changes

  • Babel Package Renames: metro-react-native-babel-preset → @react-native/babel-preset
  • Node.js 18+: Minimum Node.js requirement raised to 18.x
  • TypeScript 5.0: Template updated to TypeScript 5.0
  • iOS 13.4+: Minimum iOS version requirement
  • Deprecated Features: Flipper integration and Remote JavaScript Debugging deprecated

Full Translation

Translations

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

claudejamodel: claude-sonnet-4-20250514

React Native 0.73 - デバッグ機能の改善、安定したSymlinkサポートなど

本日、React Native 0.73をリリースします！このリリースでは、Hermesでのデバッグ機能の改善、安定したsymlinkサポート、Android 14サポート、新しい実験的機能が追加されています。また、レガシーデバッグ機能を非推奨とし、New Architectureの次の柱であるBridgeless Modeをリリースします！

ハイライト

  • デバッグ機能の改善
  • Metroでの安定したSymlinkサポート
  • AndroidでのKotlinテンプレート
  • Android 14サポート
  • New Architectureのアップデート
  • 非推奨となったデバッグ機能

破壊的変更

  • Babelパッケージの名前変更
  • その他の破壊的変更
  • React Native CLIの変更
  • 非推奨となった@types/react-native

ハイライト

デバッグ機能の改善

React NativeとHermesチームは、React Nativeでのデバッグ体験の改善に取り組んでいます。0.73では、この継続的な投資による初期の進歩を共有できることを嬉しく思います。

Hermesでのコンソールログ履歴

console.log()は、開発者がJavaScriptコードを素早くデバッグするための非常に人気のある方法です。以前のリリースでは、React Nativeアプリのコンソールログは、デバッガーが接続されるまで記録されませんでした。これにより、アプリの読み込み初期に発生するログを観察することが困難でした。

React Native 0.73では、この問題を解決しました。Hermesは現在、すべてのconsole.log()呼び出しをバックグラウンドでキャプチャし、デバッガーが最初に接続されたときにConsoleタブに送信されます。これは、Webブラウザでのデバッグ体験と一致します。

この新しい動作は、Flipper、Hermesに接続されたChrome DevTools、実験的なNew Debuggerで機能します。

デバッグドキュメントの更新

ドキュメントのDebuggingセクションを刷新し、サポートされているすべてのデバッガーの接続方法に関する最新情報、React DevToolsの詳細情報、新しいビジュアルが含まれています。

実験的なNew Debugger

React Nativeチームは、Flipperを置き換えることを意図した新しいJavaScriptデバッガー体験に取り組んでおり、React Native 0.73からTechnical Previewが利用可能です。新しいデバッガーは即座に開き、HermesでReact Nativeをデバッグするためにカスタマイズされた簡素化されたChrome DevTools UIを特徴としています。

注意
新しいデバッガーは実験的であり、React Nativeの将来のリリースで積極的に解決に取り組んでいる既知の問題があります。試用される場合は、同じディスカッションスレッドを使用してフィードバックを報告してください。

この体験を有効にする方法については、ドキュメントで詳しく学んでください。

Metroでの安定したSymlinkサポート

Metroでのsymlinkの解決サポートがデフォルトで有効になりました。Symlinkサポートにより、React Nativeは、含まれるディレクトリがwatchFoldersで設定されている場合に、monorepoセットアップで動作できるようになります。

SymlinkはMetroの内部で深く表現されており、Fast Refreshなどの機能で動作し、バンドル中のパフォーマンスオーバーヘッドはほとんどありません。SymlinkはWatchmanの有無に関わらず、すべてのデスクトッププラットフォームでサポートされています。

情報
Monorepoの回避策
React Nativeをmonorepoレイアウトで使用する際に、まだエッジケースがあることを認識しています。これらのいくつかに対処する予定の作業がありますが、0.73には間に合いませんでした。しかし、可能な限り早急に出荷することを目指しています。

React Nativeテンプレートプロジェクト（npx react-native init）の場合、Metroがそれらを発見するために、プロジェクトルート外の任意のwatchFoldersを設定する必要があります（詳細情報）。また、react-native依存関係が異なるレベルのフォルダーにインストールされている場合、ファイルパスを更新する必要がある場合があります。

Expoアプリの場合、Yarn（Classic）ワークスペースのサポートが標準で設定されています。ExpoドキュメントのWork with monorepos guideも参照してください。

AndroidでのKotlinテンプレート

0.73から、KotlinがReact Nativeで構築されたAndroidアプリの推奨言語になったことを発表できることを嬉しく思います。これは、Androidエコシステムが数年間進んできた方向に従い、モダンな言語を使用してアプリを書くことを可能にします。

AndroidでのReact Nativeのテンプレートを、JavaではなくKotlinを使用するように更新しました。新しいMainActivity.ktとMainApplication.ktファイルは、サイズが36%小さくなっています。

Upgrade Helperも更新され、.javaファイルを.ktファイルに移行しやすくなりました。

プロジェクトでJavaファイルを以前に変更していて、それらをKotlinに移行するサポートが必要な場合は、Android StudioのCode > Convert Java file to Kotlin Fileユーティリティを使用できます（ショートカットCmd ⌘ + Shift ⇧ + Option ⌥ + Kでもアクセス可能）。

Android 14サポート

React NativeをAndroid 14を完全にサポートするように更新しました。0.73から、React Native開発者は最新のAndroid SDKバージョン、API Level 34（Upside Down Cake）をターゲットにできるようになりました。

Java 17とAndroid Gradle Pluginのアップグレード

Android 14をサポートするために、Androidアプリの構築に使用されるAndroid Gradle Plugin（AGP）のバージョンを7.4.xから8.1.xに更新しました。AGPのこのメジャーバージョンアップには、Googleのリリースノート（8.0.0と8.1.0）で利用可能な一連の破壊的変更が含まれています。

最も重要なことは、Java 17がAndroidアプリを構築するための要件になったことです。Javaバージョンを17に更新するには、以下を実行してください：

brew install --cask zulu@17

そして、Getting Started guideに記載されているようにJAVA_HOMEを更新してください。

ライブラリ開発者の場合、ライブラリは変更なしでReact Native 0.73で動作するはずです。今年の初めに、AGPアップがライブラリ作成者としてのあなたにとって何を意味するかの明確化を含むノートを公開しました。

写真とビデオへの部分アクセス許可

Selected Photos Accessにより、Android 14ユーザーは、すべてのメディアへのアクセスではなく、メディアライブラリ内の特定のアイテムへのアクセスをアプリに許可できます。0.73では、React NativeアプリはPermissionsAndroid APIでREAD_MEDIA_VISUAL_USER_SELECTED権限を使用することで、この機能をサポートするようになりました。

Min SDKアップ

React Native 0.73は、Android 5.0（API Level 21）をサポートする最終バージョンになります。React Nativeの次のバージョンでは、最小SDKバージョンが23（Android 6.0）になります。

今後のmin SDKアップの変更について詳しくはこちらをお読みください。

New Architectureのアップデート

オープンソースコミュニティの皆様にReact NativeのNew Architectureを利用可能にするため、展開を続けています。React Native 0.68以降、New Renderer（Fabric）とNew Native Module System（TurboModules）の両方がユーザーが実験し評価できるようになりました。これまでに受け取ったコミュニティからのフィードバックに感謝します。

本日、New Architectureの別の部分であるBridgeless Modeをリリースします。

これまで、アプリでNew Architectureを有効にすると、古いコンポーネントやモジュールとの後方互換性をサポートするためにBridgeが引き続き利用可能でした。しかし、私たちのビジョンはbridgeを完全に廃止することです。

React Native 0.73から、bridgeの作成を完全に無効にするBridgeless Modeを有効にできます。

Bridgeless Modeと共に、Bridgeless Mode時に古いモジュールを再利用できるNative Module Interop Layerを出荷しています。React Native 0.72で導入されたRenderer Interop LayerもBridgeless Modeで動作するように適応されています。

New Architectureの他の部分と同様に、Bridgeless Modeは最初は実験的です。興味のあるユーザーには、これを有効にして、New Architecture working groupで直面する問題や非互換性を報告することをお勧めします。

非推奨となったデバッグ機能

Flipper ↔ React Native統合

React NativeアプリをデバッグするためのデフォルトツールとしてのFlipperから徐々に移行しています。0.73では、React Nativeに含まれるネイティブFlipper統合（Flipperのコアプラグインを接続するブートストラップコード）を非推奨にすることから始まります。

次のリリースでこの統合と依存関係を削除する予定です。つまり、NetworkプラグインなどのFlipperの一部が動作しなくなります。

変更なし：ネイティブアプリデバッグ用のスタンドアロン製品としてのFlipperは存在し続けます。将来的に新しいReact Nativeプロジェクトから削除された後でも、開発者は希望すればFlipperを手動でアプリに追加できます。

Flipperから移行する理由の詳細については、RFCをご覧ください。

Remote JavaScript Debugging

Remote JavaScript Debuggingは、外部Webブラウザ（Chrome）をアプリに接続し、JavaScriptコードをWebページ内で実行するレガシーデバッグモードです（例：http://localhost:8081/debugger-ui）。

このモデルは、デバッグ中に一貫性のないアプリ動作を引き起こす可能性があり、New Architecture下でのネイティブモジュールと互換性がありません。

0.73では、Remote JavaScript Debuggingは非推奨となり、Dev Menuから削除されました。リモートデバッガーの有効化は、NativeDevSettings APIを介して手動で行う必要があります。これについては、Other Debugging Methods docsで説明されています。

情報
Remote JavaScript Debuggingは、以前はJavaScriptCore（JSC）を使用するアプリのデフォルトデバッグ体験でした。iOSアプリには、代わりにSafari Developer Tools（直接JSCデバッグ）をお勧めします。すべてのプラットフォームで一貫したデバッグ体験のために、Hermesの使用をお勧めします。

破壊的変更

Babelパッケージの名前変更

2つのBabel関連パッケージをMetroからReact Nativeのリポジトリとバージョニングスキームに移動し、メンテナンスとアップグレードを簡素化できるようにしました。これらのパッケージの新しいバージョンは0.73でNew Architecture機能をサポートしているため、これらの依存関係を更新する必要があります。

アップグレード時は、これらの依存関係を更新したことを確認するために、Upgrade Helperに従ってください。

一部のパッケージの名前が変更されました：

旧パッケージ名新パッケージ名
metro-react-native-babel-preset@react-native/babel-preset
metro-react-native-babel-transformer@react-native/metro-babel-transformer

情報
@react-native/babel-presetには@react-native/babel-plugin-codegenが含まれるようになったため、Babel設定ファイルで個別に指定する必要がなくなりました。

その他の破壊的変更

以下は0.73の主要な破壊的変更の一部です。破壊的変更の完全なリストについては、完全なchangelogを参照してください。

  • 最小Node.js要件を18.xに引き上げ（#37709）（Node.js 16 EOLも参照）
  • テンプレートでTypeScript 5.0を使用（#36862）。React Native typesはTypeScript 4.8で引き続き動作します
  • Android：Java 17がAndroidアプリを構築するための要件になりました（上記参照）
  • Android：FrescoをメジャーアップしてFresco 3.0に（#38275）
  • iOS：最小iOSバージョンを13.4に引き上げ（#36795）
  • iOS：XcodeでビルドをRunning時にMetroが自動的に開始されなくなりました（#38242）

ライブラリ作成者向け：

React Native CLIの変更

ハイライトされた破壊的変更

  • build-androidコマンドのデフォルトタスクプレフィックスを変更。今後、build-androidを実行すると、assembleではなくbundleタスクが実行されます（#1913）
  • Metro設定デフォルトのフォールバックフローを削除（#1972）。0.72からの更新されたmetro.config.js形式が0.73で必要になりました。CLIからこれらのデフォルトのフォールバックコピーを削除したためです
  • run-iosから--configurationオプションを削除（--modeで置き換え）（#2028）
  • build-androidコマンドから--variantオプションを削除（--modeで置き換え）（#2026）

v12.0.0の完全なchangelogを参照してください。

非推奨となった@types/react-native

First-class Support for TypeScriptで言及したように、0.71以降、react-nativeでTypeScript typesを出荷しており、0.73では@types/react-nativeを非推奨にしています。既存のバージョンに対する将来のパッチは出荷しません。

@types/react-nativeから移行することをガイダンスとしています。移行方法については手順を参照してください。

謝辞

React Native 0.73には、68人の貢献者による2259以上のコミットが含まれています。皆様のハードワークに感謝します！

0.73へのアップグレード

既存のプロジェクトについては、React Native Upgrade Helperを使用してReact Nativeバージョン間のコード変更を確認し、Upgrading docsも参照してください。

npx react-native@latest init MyProjectで新しいプロジェクトを作成することもできます。

Expoを使用している場合、React Native 0.73はExpo SDK 50リリースでサポートされます。

情報
0.73はReact Nativeの最新安定バージョンになり、0.70.xはサポート対象外になりました。詳細については、React Nativeのサポートポリシーを参照してください。