Skip to content
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

Fix webpack/terser startTransition minification bug in production mode #10588

Merged
merged 1 commit into from Jun 12, 2023

Conversation

brophdawg11
Copy link
Contributor

This fixes the webpack/terser production build minification issue discovered in #10579 where in production mode the code would minify down such that the first half of the following ternary wouldn't actually be called:

// React Router source code
// In module scope
const START_TRANSITION = "startTransition";

// Inside BrowserRouter/etc.
let setState = React.useCallback((newState) => {
    START_TRANSITION in React
      ? React[START_TRANSITION](() => setStateImpl(newState))
      : setStateImpl(newState);
  },
  [setStateImpl]
);

This would minify down to the following using webpack, where const _ = "startTransition" and f is setStateImpl:

// Minified production webpack build
p=o.useCallback((e=>{_ in(r||(r=n.t(o,2)))||f(e)}),[f]);

Which expands to:

p = o.useCallback(e=>{
  _ in (r || (r = n.t(o,2))) || f(e)
}, [f]);

And thus setStateImpl (f) never gets executed in the case that React.startTransition is defined.

This does not seem to be an issue building in production mode with vite, which minifies down to the following where const jE="startTransition" and m is setstateImpl:

// Minified production vite build
b=B.useCallback(O=>{jE in EE?EE[jE](()=>m(O)):m(O)},[m]);

and expands to:

b = B.useCallback(O=>{
  jE in EE ? EE[jE](()=>m(O)) : m(O)
}, [m]);

Closes #10579 (partially)

@changeset-bot
Copy link

changeset-bot bot commented Jun 12, 2023

🦋 Changeset detected

Latest commit: fc85e02

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 4 packages
Name Type
react-router Patch
react-router-dom Patch
react-router-dom-v5-compat Patch
react-router-native Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@brophdawg11 brophdawg11 merged commit 2f79bce into release-next Jun 12, 2023
2 checks passed
@brophdawg11 brophdawg11 deleted the brophdawg11/start-transition-minimize-fix branch June 12, 2023 16:09
@github-actions
Copy link
Contributor

🤖 Hello there,

We just published version 6.13.0 which includes this pull request. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Bug]: v6.12.1 Navigating and changing pages does not work. No errors in console
2 participants