I have a React Native app which basically does the following actions on startup:
- Hides the splash screen (using react-native-bootsplash)
- Renders a Home screen, which fetches data from an API and shows card components in a FlatList
- Based on the user's location, immediately opens a Modal (using react-native-modal) with a suggestion
This flow happens in ~3 seconds.
It is working as expected on Android. Although, in iOS I am facing the following issue:
After opening the app, the rendered Home screen freezes and the Modal is not shown. This screen is a child of a DrawerNavigator, which continues to work. So I can open and close the drawer menu from the header, but the Home screen is completely frozen.
Tests I have performed so far:
- Removing the Modal component: screen does not freeze.
- Go to another screen (through the drawer menu) and go back to the Home screen: works normally (renders the list, opens the modal, etc), i.e. no freezing.
- Reload the app from the RN debug menu (shake or Cmd + Control + Z): works normally (renders the list, opens the modal, etc), i.e. no freezing.
It is important to notice that the app gets the user's location before opening the Modal. So the issue doesn't seem to be related to the location logic. In the test case that I removed the Modal, the location logic remained the same and the screen did not freeze.
Given the described behavior, it seems to me like some kind of conflict between the Storyboard/View which renders the splash screen and the Modal component, since it happens when I open the app, and doesn't when I reload it from the RN menu.
Therefore, I have tested waiting for 2 seconds before changing the state which opens the Modal, as follows:
setTimeout(() => setModalOpen(true), 2000);
and it works! Although, if I drop the timeout to 1 second, it still freezes. From what I have tested, the threshold seems to be around 1.3 to 1.5 seconds, meaning that anything below that causes freezing, and everything above works normally.
I have tested in both emulator (iPhone 11 - iOS 13.5) and device (iPhone XR - iOS 14.2).
Does someone know what exactly might be causing this behavior, and how it could be avoided without having to use timeouts as a workaround?