Next.js Discord

Discord Forum

How to disable client-side <Activity> (Keep Alive) behavior when using "use cache" in Next.js 16?

Unanswered
Bombay posted this in #help-forum
Open in Discord
BombayOP
I am experimenting with Next.js 16 and React 19, specifically utilizing the new "use cache" directive (Cache Components).

The Problem
I've noticed that when navigating between routes, the App Router no longer unmounts the previous page from the DOM. Instead, it wraps the previous page in a React <Activity> component (Offscreen) and applies display: none !important.

While I understand this is likely for "Instant Back" navigation, it is breaking my application's styling.

Because the previous page remains in the DOM:
1. Global Styles Leak: Styles from the "hidden" page (Page A) are still active and conflict with the current page (Page B).
2. Z-Index/Layout Conflicts: Fixed elements or 3rd-party widgets from the previous page still interfere with the layout, even when hidden.
3. Cleanup Issues: useEffect cleanup functions do not run immediately, causing issues with libraries that expect a clean DOM.

What I need help with
I want to use the server-side benefits of "use cache", but I need the client router to fully unmount the previous page on navigation, just like standard React behavior.

1. Is there a next.config.js flag to disable this "Keep Alive" / Activity behavior globally?
2. Is there a recommended way to opt-out of this behavior?

1 Reply

Pacific sand lance
1. no
2. fork nextjs, update source as necessary