リリース内容

https://reactnative.dev/blog/2024/04/22/release-0.74

Yoga 3.0

React Nativeで内部的に利用しているレイアウトエンジンのYogaがVersion 3.0になった。

主な変更点

• position: static のサポート
• align-content: space-evenly をサポート。
  • W3Cより
• レイアウトの正確性の向上
• YogaのJavaScriptバインディングがESモジュールとして配布されるようになりました。
• Javaバインディングにおけるいくつかのクラッシュを修正
• 一部の既存Yoga APIは削除されました。

Yoga 3.0に付いての詳細はこちら
https://www.yogalayout.dev/blog/announcing-yoga-3.0

New Architecture: Bridgelessがデフォルトで有効に

0.73で導入されていたBridgelessモードが、New Architectureを有効にしている場合デフォルトで有効になった。

Bridgelessモードとは？

これまでのReact Nativeの仕組みでは、JSとNative間でやりとりを行うものとしてBridgeが存在していた。
それによってパフォーマンスの問題やいくつかの制限があった。

Bridgelessモードはそれらを取り除くことでパフォーマンスの問題などを解消する。

https://github.com/reactwg/react-native-new-architecture/discussions/154

New Architecture: onLayoutの更新がバッチ処理になる

New Architectureで onLayout コールバックがバッチ処理されるようになった。
次のように2つのViewで次のようなonLayoutコールバックを設定しているとき、setState1とsetState2の更新はまとめて行われる。

function MyComponent(props) {
  const [state1, setState1] = useState(false);
  const [state2, setState2] = useState(false);

  return (
    <View>
      <View
        onLayout={() => {
          setState1(true);
       }}>
      <View
         onLayout={() => {
          // When this event is executed, state1's new value is no longer observable here.
          setState2(true);
        }}>
      </View>
    </View>
  );
}

これらはReactで期待される動作と同じになり、再レンダリングも少なくなる。

Yarn v3がデフォルトのパッケージマネージャーになった

新しくプロジェクトを作成するとき、Yarn v3がデフォルトのパッケージマネージャーとなった。

Yarn v3での動作は nodeLinker: node-modules となり、React Nativeライブラリとの互換性を保つようになっている。
（一部ライブラリなど、 node-modules 配下のディレクトリを参照するため）

次のように --pm オプションでパッケージマネージャーは指定することも可能。

npx react-native@latest init --pm npm ProjectName 

詳しくはこちら

Androidの最小SDKはAPI Level 23(Android 6.0)に

2023年10月のPlayストアの統計によると、Android 5.0/5.1のシェアは1.4%ほど。
Googleからは2019年時点でMinimum SDK Versionを23以上に上げることを推奨している。

React NativeでMinimum SDK Versionを上げることで、コードベースをシンプルにでき、アプリサイズも4MBほど削減できた

PropTypesの削除

React 15.5以降非推奨となったAPIであるPropTypesがReact Nativeには未だに残っていた。
以下のPropTypesを利用している場合は置き換える必要がある。

• Image.propTypes
• Text.propTypes
• TextInput.propTypes
• ColorPropType
• EdgeInsetsPropType
• PointPropType
• ViewPropTypes

これによって少しではあるがバンドルサイズとメモリをオーバーヘッドを削減した。

DeprecatedなPushNotificationIOSの変更

今後(React Native0.75) PushNotificationIOS APIは削除される予定。

React Native 0.75からコアモジュールからコミュニティパッケージの@react-native-community/push-notification-ios に移動される。