This documentation is available as Markdown for AI agents and LLMs. See the full Markdown index or append .md to any documentation URL.

Learn how to release resources from inactive routes while preserving their state.

This is an experimental feature available in Expo SDK 58 and later.

React's <Activity> can hide inactive route content while preserving its state. Hidden content cleans up effects and releases resources until it becomes visible again.

Enable activity handling on a navigator and override it for individual routes:

import { Stack } from 'expo-router';

export default function RootLayout() {
  return (
    <Stack activityEnabled>
      {/* Keep this screen active while another screen covers it. */}
      <Stack.Screen name="music" activityEnabled={false} />
      {/* Hide this screen as soon as another screen covers it. */}
      <Stack.Screen name="editor" activityEnabled={1} />
      {/* Hide this screen when three screens are above it. */}
      <Stack.Screen name="feed" activityEnabled={3} />
    </Stack>
  );
}

Configure when screens hide

For a Stack, activityEnabled hides a screen when two screens are above it. A positive number changes this threshold. Setting it to 1 hides the screen as soon as it loses focus.

JavaScript tabs, native tabs, headless tabs, and drawers hide a screen when it loses focus.

Wrap route content manually

Use <NavigationAwareActivity> when you need to wrap only part of a screen:

import { NavigationAwareActivity } from 'expo-router';
import { useEffect } from 'react';
import { Text } from 'react-native';

function Details() {
  useEffect(() => {
    console.log('Details became visible');

    return () => console.log('Details became hidden');
  }, []);

  return <Text>Details</Text>;
}

export default function DetailsScreen() {
  return (
    <NavigationAwareActivity hideWhenNestedAtLevel={1}>
      <Details />
    </NavigationAwareActivity>
  );
}

The effect cleanup runs when the screen hides. React preserves the component's state, so the component does not unmount.

<NavigationAwareActivity> must render inside a route screen. See the Expo Router API reference for all activity options.