React Native's new architecture

[vanGalilea]

Hi all,

This discussion will contain an overview of where we stand as an SDK concerning opting in for the new architecture.
We're mainly a JS SDK that uses other libs that most bridge a specific native behaviour.

This is why most of our impediments will come from external factors, mainly these libs. that might not be ready yet.

Libs. blocking us:

• RN SVG lib- see Weird Display in RN V0.68 New Architecture Enabled software-mansion/react-native-svg#1709
• Problem with react-native-reanimated >=3.0.0-rc-0. Ref - 3.0.0-rc.2 Android - TypeError: Cannot read property 'stateNode' of undefined software-mansion/react-native-reanimated#3534

ERROR  TypeError: Cannot read property 'stateNode' of undefined
This error is located at:
in FlatList (created by AnimatedComponent(FlatList))
in AnimatedComponent(FlatList)
in Unknown (created by NativeViewGestureHandler)
in NativeViewGestureHandler (created by BottomSheetFlatList)
in RCTView (created by View)
in View (created by AnimatedComponent(View))
in AnimatedComponent(View)
in Unknown (created by PanGestureHandler)
in PanGestureHandler (created by BottomSheetDraggableViewComponent)
in BottomSheetDraggableViewComponent (created by BottomSheetFlatList)
in BottomSheetFlatList (created by BottomSheetFlatList)
in RCTView (created by View)
in View (created by AnimatedComponent(View))
in AnimatedComponent(View)
in Unknown (created by PanGestureHandler)
in PanGestureHandler (created by BottomSheetDraggableViewComponent)
in BottomSheetDraggableViewComponent (created by BottomSheet)
in RCTView (created by View)
in View (created by AnimatedComponent(View))
in AnimatedComponent(View)
in Unknown (created by BottomSheet)
in RCTView (created by View)
in View (created by AnimatedComponent(View))
in AnimatedComponent(View)
in Unknown (created by BottomSheet)
in RCTView (created by View)
in View (created by BottomSheetContainerComponent)
in BottomSheetContainerComponent (created by BottomSheet)
in BottomSheetGestureHandlersProvider (created by BottomSheet)
in BottomSheet (created by BottomSheet)
in AttachmentPicker (created by OverlayProvider)
in ThemeProvider (created by OverlayProvider)
in ImageGalleryProvider (created by OverlayProvider)
in AttachmentPickerProvider (created by OverlayProvider)
in MessageOverlayProvider (created by OverlayProvider)
in TranslationProvider (created by OverlayProvider)
in OverlayProvider (created by App)
in RCTView (created by View)
in View (created by GestureHandlerRootView)
in GestureHandlerRootView (created by App)
in EnsureSingleNavigator
in BaseNavigationContainer
in ThemeProvider
in NavigationContainerInner (created by App)
in App
in RNCSafeAreaProvider (created by SafeAreaProvider)
in SafeAreaProvider
in Unknown
in RCTView (created by View)
in View (created by AppContainer)
in RCTView (created by View)
in View (created by AppContainer)
in AppContainer
in NewArchStream(RootComponent), js engine: hermes

• Significantly slow build times on android.

[khushal87]

Observations:

• React Native Reanimated has enhanced support of new architecture with >=v3.0.0.
• @gorhom/react-native-bottom-sheet still isn't ready with the above version of RN Reanimated; hence the error 3.0.0-rc.2 Android - TypeError: Cannot read property 'stateNode' of undefined software-mansion/react-native-reanimated#3534 is thrown.
• There's a better build time performance now on Android compared to last time.

[khushal87]

Repo: https://github.com/khushal87/stream-chat-react-native-new-architecture.git