Skip to content

Implement Navigation API backed default indicator for DOM renderer #33162

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 5 commits into
base: main
Choose a base branch
from

Conversation

sebmarkbage
Copy link
Collaborator

Stacked on #33160.

By default, if onDefaultTransitionIndicator is not overridden, this will trigger a fake Navigation event using the Navigation API. This is intercepted to create an on-going navigation until we complete the Transition. Basically each default Transition is simulated as a Navigation.

This triggers the native browser loading state (in Chrome at least). So now by default the browser spinner spins during a Transition if no other loading state is provided. Firefox and Safari hasn't shipped Navigation API yet and even in the flag Safari has, it doesn't actually trigger the native loading state.

To ensures that you can still use other Navigations concurrently, we don't start our fake Navigation if there's one on-going already. Similarly if our fake Navigation gets interrupted by another. We wait for on-going ones to finish and then start a new fake one if we're supposed to be still pending.

There might be other routers on the page that might listen to intercept Navigation Events. Typically you'd expect them not to trigger a refetch when navigating to the same state. However, if they want to detect this we provide the "react-transition" string in the info field for this purpose.

@github-actions github-actions bot added the React Core Team Opened by a member of the React Core Team label May 9, 2025
@react-sizebot
Copy link

Comparing: 5069e18...b7ad698

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name +/- Base Current +/- gzip Base gzip Current gzip
oss-stable/react-dom/cjs/react-dom.production.js = 6.68 kB 6.68 kB = 1.83 kB 1.83 kB
oss-stable/react-dom/cjs/react-dom-client.production.js +0.31% 528.09 kB 529.74 kB +0.34% 93.17 kB 93.48 kB
oss-experimental/react-dom/cjs/react-dom.production.js = 6.69 kB 6.69 kB = 1.83 kB 1.83 kB
oss-experimental/react-dom/cjs/react-dom-client.production.js +0.53% 646.40 kB 649.80 kB +0.53% 113.71 kB 114.32 kB
facebook-www/ReactDOM-prod.classic.js +0.27% 674.15 kB 675.93 kB +0.34% 118.41 kB 118.81 kB
facebook-www/ReactDOM-prod.modern.js +0.27% 664.43 kB 666.21 kB +0.33% 116.81 kB 117.19 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show
Name +/- Base Current +/- gzip Base gzip Current gzip
oss-experimental/react-art/cjs/react-art.production.js +0.53% 348.50 kB 350.33 kB +0.54% 58.77 kB 59.09 kB
oss-experimental/react-dom/cjs/react-dom-client.production.js +0.53% 646.40 kB 649.80 kB +0.53% 113.71 kB 114.32 kB
oss-experimental/react-dom/cjs/react-dom-unstable_testing.production.js +0.51% 660.82 kB 664.21 kB +0.55% 117.24 kB 117.89 kB
oss-experimental/react-dom/cjs/react-dom-profiling.profiling.js +0.48% 708.55 kB 711.95 kB +0.52% 122.75 kB 123.38 kB
oss-experimental/react-reconciler/cjs/react-reconciler.production.js +0.40% 475.65 kB 477.54 kB +0.44% 75.91 kB 76.25 kB
oss-experimental/react-reconciler/cjs/react-reconciler.profiling.js +0.35% 535.70 kB 537.60 kB +0.46% 83.95 kB 84.33 kB
oss-experimental/react-dom/cjs/react-dom-client.development.js +0.33% 1,166.50 kB 1,170.35 kB +0.37% 193.94 kB 194.65 kB
oss-experimental/react-dom/cjs/react-dom-profiling.development.js +0.33% 1,182.88 kB 1,186.73 kB +0.36% 196.76 kB 197.48 kB
oss-experimental/react-dom/cjs/react-dom-unstable_testing.development.js +0.33% 1,183.04 kB 1,186.89 kB +0.35% 197.62 kB 198.32 kB
oss-stable-semver/react-dom/cjs/react-dom-client.production.js +0.31% 527.97 kB 529.62 kB +0.34% 93.14 kB 93.46 kB
oss-stable/react-dom/cjs/react-dom-client.production.js +0.31% 528.09 kB 529.74 kB +0.34% 93.17 kB 93.48 kB
oss-experimental/react-art/cjs/react-art.development.js +0.30% 669.99 kB 672.01 kB +0.29% 105.48 kB 105.78 kB
oss-stable-semver/react-dom/cjs/react-dom-profiling.profiling.js +0.29% 561.61 kB 563.27 kB +0.33% 98.10 kB 98.42 kB
oss-stable/react-dom/cjs/react-dom-profiling.profiling.js +0.29% 561.74 kB 563.39 kB +0.33% 98.12 kB 98.44 kB
facebook-react-native/react-dom/cjs/ReactDOMClient-prod.js +0.29% 574.89 kB 576.54 kB +0.32% 101.32 kB 101.65 kB
facebook-react-native/react-dom/cjs/ReactDOMProfiling-prod.js +0.28% 580.39 kB 582.04 kB +0.31% 102.40 kB 102.72 kB
facebook-react-native/react-dom/cjs/ReactDOMClient-profiling.js +0.27% 603.09 kB 604.74 kB +0.31% 105.35 kB 105.67 kB
facebook-react-native/react-dom/cjs/ReactDOMProfiling-profiling.js +0.27% 609.02 kB 610.67 kB +0.31% 106.49 kB 106.81 kB
facebook-www/ReactDOM-prod.modern.js +0.27% 664.43 kB 666.21 kB +0.33% 116.81 kB 117.19 kB
facebook-www/ReactDOM-prod.classic.js +0.27% 674.15 kB 675.93 kB +0.34% 118.41 kB 118.81 kB
facebook-www/ReactDOMTesting-prod.modern.js +0.26% 678.83 kB 680.62 kB +0.30% 120.45 kB 120.82 kB
facebook-www/ReactDOMTesting-prod.classic.js +0.26% 688.55 kB 690.34 kB +0.29% 122.04 kB 122.40 kB
oss-experimental/react-reconciler/cjs/react-reconciler.development.js +0.25% 795.20 kB 797.21 kB +0.32% 123.80 kB 124.20 kB
facebook-www/ReactDOM-profiling.modern.js +0.24% 735.76 kB 737.55 kB +0.29% 126.46 kB 126.83 kB
facebook-www/ReactDOM-profiling.classic.js +0.24% 743.81 kB 745.59 kB +0.29% 127.75 kB 128.12 kB

Generated by 🚫 dangerJS against b7ad698

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed React Core Team Opened by a member of the React Core Team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants