[0.74] An Update on the New Renderer Interop Layer

[cipolleschi]

Important

tl;dr: With React Native 0.74, the New Renderer Interop Layer is becoming automatic and is receiving several improvements to make New Architecture migrations even easier

During the rollout of React Native 0.74, we worked hard to make sure that the most popular components libraries are compatible with the New Architecture and Bridgeless flawlessly.

In order to achieve this, we improved the New Renderer Interop Layers, adding support to further features.

Automatic Interop Layer

The New Renderer Interop layers are now automatically enabled when you turn on the New Architecture.

You can now remove the unstable_reactLegacyComponentNames from your react-native.config.js file: the interop layer will work with every component that has not migrated yet. The component names you specify in the unstable_reactLegacyComponentNames field will be ignored starting from 0.74.

To turn on the New Architecture, follow the instructions in the New Architecture documentation:

• Android
• iOS

In this setup, components that are using the old renderer’s API will go through the interop layer and they will be rendered in the New Renderer automatically.

New features for New Renderer Interop Layer

On top of making the interop layer automatic, we pushed some other improvements, adding support for some missing APIs and lookup mechanisms. These might not be many changes, but they enable whole classes of components and controls that were not working properly before.

Android

• Added support for addUIBlock APIs which were not available in React Native < 0.74 (Commit). This enabled the migration of critical OSS libraries such as react-native-view-shot which now fully supports the New Architecture.
• Added support to look-up ViewManagers with the RCT prefix also on Android (Commit)

iOS

• Fixed a bug that make the Interop Layer crash when an event was emitted too early in the component lifecycle (Commit).
• Forward touches to the component wrapped by the Interop Layer (Commit).

Known Limitation

The work on the Interop Layers is an ongoing effort. We are committed to support them for the time being in order to facilitate the migration to the New Architecture. However, we need your help to know in which scenarios they are lacking.

Those are the known limitations to the Renderer Interop Layer:

• Concurrent Features (such as startTransition) => They should not work in the interop layer. If they do, is for an accident. We can’t guarantee that they will work in all the situations, and you should definitely not rely on the interop layer for those features.
  These features require a proper migration to the New Renderer to work correctly, and we cannot fully support them in the interop layer due to architectural limitations.
• Usage of custom Shadow Nodes - If your Component is using a custom Shadow node (i.e. on Android you're subclassing the createShadowNodeInstance() method), the Interop Layer won't work. On the New Architecture all the shadow node information are stored in C++ so your custom shadow node informations will be ignored.

If you find an occurrence of a legacy component not working properly when the New Architecture is turned on, please open an issue using this template.