79450112

Date: 2025-02-19 03:33:56
Score: 1
Natty:
Report link

@Eternal Dreamer's Solution did solve a big fraction of the Issue. Additionally, I went over the Documentation of react-navigation/native at https://reactnavigation.org/ to learn how to effectively use the Stack Navigator. Summarized up I:

  1. Moved const Stack = createStackNavigator(); out of my React components like export default function App(){...}, as suggested
  2. Leveraged the use of navigation.goBack() and .popTo() as these functions discard loaded pages from the Stack, hence freeing memory
  3. Reducing the amount of nested Navigators in my project. Example: I only kept one for defining many settings-options routes, which only have to be loaded, when the main Settings screen is opened.
  4. Reduced the amount of const *name* = useNavigation() calls in different components like a custom-header and migrated to passing a navigation element to such elements via their definition. Example: export const *ExampleHeader* = ({ navigation }: { navigation: NativeStackNavigationProp<any> }) => { return *The Headers Options*

In the end, the Application will always consume a bit of memory when rendering new components or a new page.

Reasons:
  • Long answer (-1):
  • Has code block (-0.5):
  • User mentioned (1): @Eternal
  • Self-answer (0.5):
  • Low reputation (1):
Posted by: BrightLights