Support the Navigation API

[loganvolkers]

The Navigation API is a replacement for the History API.

It has graduated from being a HTML Spec PR to a part of the spec and landed in Chrome 110 (~ February 7th 2023, plus other Chromium-based browsers since).

Some excellent features include:

• The navigate event: a powerful way to conditionally convert cross-document navigations to same-document navigations
• entries: exposing a list of NavigationHistoryEntry as an abstraction over same-origin session history entries
• Focus reset and scroll behaviour
• Handling a 'traverse' navigation event is much more intuitive than a popstate. You can avoid reacting to it, derive whether the direction was forward or backwards by comparing entry index, and much more.

In preliminary results from State of HTML 2023, the Navigation API was a somewhat common response to the freeform question "Which existing HTML features or browser APIs are you unable to use because of browser differences or lack of support?"

Where can I learn more?

Being discussed in the interop project: web-platform-tests/interop#435

What should change in React Router

React Router should rely on the navigate event for core state changes. This will make React Router able to operate in an islands architecture of many front-end applications.

[martinszeltins]

Yes, 💯. It is finally possible to get native browser loading indicator showing when navigating between routes in a SPA. This has been long overdue.

[ryanflorence]

We were involved in very early conversations about the navigation API and are happy how it shaped up, all of our feedback seems to have been included. The moment it's practical to use it, we will.

[kiddliu]

Any schedule on this? Really love to see if Navigation API can help with the focus management #9555

[brophdawg11]

I don't know that we'll make a serious effort at adding support until it's implemented by Safari (that's when I'd consider it "practical to use it"), otherwise we just end up bloating the code since we have to send both implementations to all users to feature detect.

https://developer.mozilla.org/en-US/docs/Web/API/Navigation_API#browser_compatibility

[kiddliu]

Fully understood...

Did some quick check on WebKit Bugzilla and PRs, they seems making progress to land this feature.

[enjikaka]

In Chrome now!

https://www.youtube.com/watch?v=bSua9vMdrNM&t=460s

[martinszeltins]

The video talks about Speculation Rules AI not Navigation API. Those are 2 different things, I believe?

[enjikaka]

Oh sorry. Should have read closer. Google tricked me to this thread...