Integrating the new Navigation API into RSC framework

[grahammendick]

I've been trying to integrate the new Navigation API into my RSC framework. You can see my progress in the vid below where I first cancel a navigation by pressing 'X' and then change my mind mid-navigation. Concurrent React pairs very nicely with navigation interception. Up to a point.

Screen.Recording.2026-05-19.at.18.17.31.mov

You see, the new Navigation api is meant to work as shown below. You fetch the data in the precommitHandler and update the DOM in the handler. The precommitHandler runs before the URL updates and the user can cancel the navigation during this phase. Once the precommitHandler resolves then the browser records the scroll position and may take a screen snapshot to display during a swipe back transition (on mobile, for example).

const onNavigate = (e) => {
    e.intercept({
        async precommitHandler() {
            // fetch data
        },
        async handler() {
            // update the DOM
        }
    });
};

The problem is with concurrent React I can only get it working as follows. So React commits the DOM before the precommitHandler resolves and this messes up scroll restoration and screen snapshots, for example.

const onNavigate = (e) => {
    e.intercept({
        async precommitHandler() {
            // fetch data and update the DOM
        },
    });
};

Would React be interested in exposing something to RSC frameworks so they can get in between the background render completing and the changes being committed to the DOM?

[tom-sherman]

I believe Next.js has managed to integrate this API, maybe worth digging through it's source?

[grahammendick]

What makes you think that? There's no mention of precommitHandler in their codebase