New Architecture Known Issues & Troubleshooting

[cortinico]

tl;dr: This post collects all the known issues with related resolutions to help users migrate the the New Architecture

Hi all,

With React Native 0.76 approaching, we want to collect in a single place all the known issues and troubleshooting we collected from the previous months of experimentation with the New Architecture.

This is a living document and we’ll be updating this document as we get more bug reports. If you encounter any issues migrating to the New Architecture, please open a new issue using this template.

Modules Known Issues

Unable to use Object.keys on NativeModules

Answer: This is by design. We designed the TurboModule system with the goal of lazy loading, so we don’t have to load all the modules in memory when the app is launched. This should let your app start faster.

One of the trade-offs of this solution is that you cannot call Object.keys on a native module right away, because not all the keys might be available immediately.

Instead, you can read them by leveraging the inheritance. You can call Object.keys on the native module prototype and the result should be the same as before.

- for prop in Object.keys(nativeModule) {
+ for prop in Object.keys(Object.getPrototypeOf(nativeModule)) {
 // use the prop here
}

** [iOS] Cannot access CallInvoker from RCTCxxBridge.callInvoker

Answer: In bridgeless mode, the bridge is not initialized anymore. So, if you were retrieving the jsCallInvoker instance from the [RCTBridge currentBridge] invocation, that might not work well anymore.

If you need this functionality, the best approach is to implement a pure C++ TurboModule which receives the callInvoker as a parameter when it is initialized.

This will also help you write more encapsulated code.

Components Known Issues

** Components with custom Shadow Nodes and measurement are not working with the Interop Layer.

Answer: This is by design because the New Architecture stores the shadow node and layout information in the C++ layer. If your custom component/library is providing a custom shadow node implementation you won’t be able to use it via the Interop Layer (this is a known limitation of the Interop Layer).

Specifically on Android, if your ViewManager class is implementing any of those methods:

• createShadowNodeInstance() (reference)
• createShadowNodeInstance(ReactApplication) (reference)
• createShadowNodeClass() (reference)
• measure(Context,ReadableMap,ReadableMap,ReadableMap,float,YogaMeasureMode, float, YogaMeasureMode heightMode, float[]) (reference)

Your component won’t be working with the Interop Layer and will require an implementation with the new Renderer.

[myselfuser1]

Can you please check this

[sidorchukandrew]

Does this mean createShadowNodeInstance, createShadowNodeClass and measure do work with Fabric on Android? I created a new library with builder bob but measure and createShadowNodeInstance are never called. I'm 99% sure I do not have the interop layer on because my logs say Bridgeless mode is enabled and fabric: true. The component renders to the screen but is not clickable because it doesn't have a height and width.

[sidorchukandrew]

Thank you for the explanation! Is there documentation on how to make it work through the C++ layer? I'm playing around with the community RN slider package and I also see Bridgeless mode is enabled and fabric: true in the console logs. When I drop a breakpoint right here, the breakpoint is actually hit. If I understand your most recent comment, this shouldn't be the case because the measurements should be coming from C++.

It's obvious that I'm misunderstanding something, so any clarifications would be very appreciated!

[sidorchukandrew]

Also thank you for such a quick response! That is much appreciated!

** Components with custom Shadow Nodes and measurement are not working with the Interop Layer.

Reading this, I thought that meant that if the Interop layer is on, then the measurements won't work. But if it's off, measuring would continue to work. I also thought the interop layer only turns on when a component does not support the new architecture. My intention is to create a component that only supports the new architecture, so the interop layer should be off.

[sidorchukandrew]

I just found this PR that shows how the slider uses C++ to measure!

[sidorchukandrew]

Since Fabric is the future, documentation on how to implement these shadow modes and measurements, and how to connect it with the library would be immensely helpful! I'm almost tempted to only use the old architecture for now because it's very difficult to determine what the right steps are. Regardless, this is all very exciting stuff!

[cortinico]

Nope we don't have custom C++ documentation at the moment as that's sort of an advanced topic. Documentation is extremely costly to write and can get stale really easy so we focused on the most common scenarios first. As a remediation, you can check how the core components like Switch and others integrate as they all go through custom C++ code.

We hope to have capacity to add further New Architecture documentation in the near future