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

[RFC] Codemod invariant -> throw new Error #22435

Merged
merged 9 commits into from
Sep 30, 2021

Conversation

acdlite
Copy link
Collaborator

@acdlite acdlite commented Sep 26, 2021

Based on #22428 and #22429

[Submitting for discussion]

A few years ago, I updated our build to compile invariant calls to throw expressions: #15071. We still use invariant in the source, though, because our error minification script depended on it.

Now that we can minify throw expressions, too, (#22428 and #22429), invariant is no longer needed.

This PR converts all uses of invariant to the equivalent throw call expression.

The commits are designed to be reviewed in sequence.

I wrote an automated codemod and used jscodeshift to perform the conversion. I checked the script in temporarily for reference, then reverted it in a later commit, since there's no reason to keep it around in the repo.

All the automated changes — the codemod itself, ESLint autofix to remove the invariant imports, and Prettier — are contained in a single commit. The few manual changes I made after that are contained in a subsequent commit.

One of the things the codemod does is simplify condition passed to invariant:

  • invariant(false, msg) is converted to an unguarded throw statement instead of if (!false) {...}.
  • invariant(a === b) is converted to if (a !== b) {...}
  • ...and so on

Comparisons involving >, <, etc cannot be safely inverted in all cases. For example, !(NaN > foo) is not the same as !NaN <= foo. In those cases, the codemod would output a FIXME comment to prompt a manual review. You can see those in the commit that contains the manual changes.

@facebook-github-bot facebook-github-bot added the React Core Team Opened by a member of the React Core Team label Sep 26, 2021
@sizebot
Copy link

sizebot commented Sep 26, 2021

Comparing: f5d946d...3ed2d03

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.min.js = 130.22 kB 130.05 kB = 41.45 kB 41.34 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js = 133.05 kB 132.88 kB = 42.42 kB 42.30 kB
facebook-www/ReactDOM-prod.classic.js = 412.61 kB 412.54 kB = 76.37 kB 76.28 kB
facebook-www/ReactDOM-prod.modern.js = 401.23 kB 401.13 kB = 74.67 kB 74.56 kB
facebook-www/ReactDOMForked-prod.classic.js = 412.61 kB 412.54 kB = 76.38 kB 76.28 kB
oss-experimental/react-fetch/cjs/react-fetch.node.production.min.js +15.18% 2.01 kB 2.31 kB +18.95% 0.91 kB 1.09 kB
oss-stable-semver/react-fetch/cjs/react-fetch.node.production.min.js +15.18% 2.01 kB 2.31 kB +18.95% 0.91 kB 1.09 kB
oss-stable/react-fetch/cjs/react-fetch.node.production.min.js +15.18% 2.01 kB 2.31 kB +18.95% 0.91 kB 1.09 kB
oss-stable-semver/react/cjs/react-unstable-shared-subset.development.js +13.10% 0.46 kB 0.52 kB +11.08% 0.33 kB 0.36 kB
oss-stable/react/cjs/react-unstable-shared-subset.development.js +13.10% 0.46 kB 0.52 kB +11.08% 0.33 kB 0.36 kB
facebook-relay/flight/ReactFlightNativeRelayClient-prod.js +7.71% 5.82 kB 6.27 kB +13.34% 1.66 kB 1.89 kB
facebook-www/ReactFlightDOMRelayClient-prod.classic.js +7.71% 5.83 kB 6.28 kB +12.91% 1.67 kB 1.89 kB
facebook-www/ReactFlightDOMRelayClient-prod.modern.js +7.71% 5.83 kB 6.28 kB +12.91% 1.67 kB 1.89 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack.production.min.js +5.95% 3.82 kB 4.05 kB +7.52% 1.70 kB 1.83 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack.production.min.js +5.95% 3.82 kB 4.05 kB +7.52% 1.70 kB 1.83 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack.production.min.js +5.95% 3.82 kB 4.05 kB +7.52% 1.70 kB 1.83 kB
oss-experimental/react-client/cjs/react-client-flight.production.min.js +5.72% 3.34 kB 3.53 kB +7.15% 1.50 kB 1.60 kB
oss-stable-semver/react-client/cjs/react-client-flight.production.min.js +5.72% 3.34 kB 3.53 kB +7.15% 1.50 kB 1.60 kB
oss-stable/react-client/cjs/react-client-flight.production.min.js +5.72% 3.34 kB 3.53 kB +7.15% 1.50 kB 1.60 kB
oss-experimental/react-server-dom-webpack/umd/react-server-dom-webpack.production.min.js +5.64% 4.02 kB 4.25 kB +7.09% 1.79 kB 1.92 kB
oss-stable-semver/react-server-dom-webpack/umd/react-server-dom-webpack.production.min.js +5.64% 4.02 kB 4.25 kB +7.09% 1.79 kB 1.92 kB
oss-stable/react-server-dom-webpack/umd/react-server-dom-webpack.production.min.js +5.64% 4.02 kB 4.25 kB +7.09% 1.79 kB 1.92 kB
facebook-www/ReactDOMServer-prod.modern.js +3.83% 68.41 kB 71.03 kB +6.70% 14.35 kB 15.31 kB
facebook-www/ReactFlightDOMRelayServer-prod.classic.js +3.28% 15.28 kB 15.79 kB +3.57% 3.98 kB 4.12 kB
facebook-www/ReactFlightDOMRelayServer-prod.modern.js +3.28% 15.28 kB 15.79 kB +3.57% 3.98 kB 4.12 kB
oss-experimental/react-fetch/cjs/react-fetch.browser.development.js +2.05% 3.32 kB 3.39 kB +3.18% 1.10 kB 1.14 kB
oss-stable-semver/react-fetch/cjs/react-fetch.browser.development.js +2.05% 3.32 kB 3.39 kB +3.18% 1.10 kB 1.14 kB
oss-stable/react-fetch/cjs/react-fetch.browser.development.js +2.05% 3.32 kB 3.39 kB +3.18% 1.10 kB 1.14 kB
oss-experimental/react-pg/cjs/react-pg.node.development.server.js = 2.95 kB 2.89 kB = 1.17 kB 1.16 kB
oss-stable-semver/react-pg/cjs/react-pg.node.development.server.js = 2.95 kB 2.89 kB = 1.17 kB 1.16 kB
oss-stable/react-pg/cjs/react-pg.node.development.server.js = 2.95 kB 2.89 kB = 1.17 kB 1.16 kB
oss-experimental/jest-react/cjs/jest-react.production.min.js = 2.62 kB 2.40 kB = 1.30 kB 1.18 kB
oss-stable-semver/jest-react/cjs/jest-react.production.min.js = 2.62 kB 2.40 kB = 1.30 kB 1.18 kB
oss-stable/jest-react/cjs/jest-react.production.min.js = 2.62 kB 2.40 kB = 1.30 kB 1.18 kB
oss-experimental/react-suspense-test-utils/cjs/react-suspense-test-utils.js = 2.65 kB 2.15 kB = 1.10 kB 0.86 kB
oss-stable-semver/react-suspense-test-utils/cjs/react-suspense-test-utils.js = 2.65 kB 2.15 kB = 1.10 kB 0.86 kB
oss-stable/react-suspense-test-utils/cjs/react-suspense-test-utils.js = 2.65 kB 2.15 kB = 1.10 kB 0.86 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-fetch/cjs/react-fetch.node.production.min.js +15.18% 2.01 kB 2.31 kB +18.95% 0.91 kB 1.09 kB
oss-stable-semver/react-fetch/cjs/react-fetch.node.production.min.js +15.18% 2.01 kB 2.31 kB +18.95% 0.91 kB 1.09 kB
oss-stable/react-fetch/cjs/react-fetch.node.production.min.js +15.18% 2.01 kB 2.31 kB +18.95% 0.91 kB 1.09 kB
oss-stable-semver/react/cjs/react-unstable-shared-subset.development.js +13.10% 0.46 kB 0.52 kB +11.08% 0.33 kB 0.36 kB
oss-stable/react/cjs/react-unstable-shared-subset.development.js +13.10% 0.46 kB 0.52 kB +11.08% 0.33 kB 0.36 kB
facebook-relay/flight/ReactFlightNativeRelayClient-prod.js +7.71% 5.82 kB 6.27 kB +13.34% 1.66 kB 1.89 kB
facebook-www/ReactFlightDOMRelayClient-prod.classic.js +7.71% 5.83 kB 6.28 kB +12.91% 1.67 kB 1.89 kB
facebook-www/ReactFlightDOMRelayClient-prod.modern.js +7.71% 5.83 kB 6.28 kB +12.91% 1.67 kB 1.89 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack.production.min.js +5.95% 3.82 kB 4.05 kB +7.52% 1.70 kB 1.83 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack.production.min.js +5.95% 3.82 kB 4.05 kB +7.52% 1.70 kB 1.83 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack.production.min.js +5.95% 3.82 kB 4.05 kB +7.52% 1.70 kB 1.83 kB
oss-experimental/react-client/cjs/react-client-flight.production.min.js +5.72% 3.34 kB 3.53 kB +7.15% 1.50 kB 1.60 kB
oss-stable-semver/react-client/cjs/react-client-flight.production.min.js +5.72% 3.34 kB 3.53 kB +7.15% 1.50 kB 1.60 kB
oss-stable/react-client/cjs/react-client-flight.production.min.js +5.72% 3.34 kB 3.53 kB +7.15% 1.50 kB 1.60 kB
oss-experimental/react-server-dom-webpack/umd/react-server-dom-webpack.production.min.js +5.64% 4.02 kB 4.25 kB +7.09% 1.79 kB 1.92 kB
oss-stable-semver/react-server-dom-webpack/umd/react-server-dom-webpack.production.min.js +5.64% 4.02 kB 4.25 kB +7.09% 1.79 kB 1.92 kB
oss-stable/react-server-dom-webpack/umd/react-server-dom-webpack.production.min.js +5.64% 4.02 kB 4.25 kB +7.09% 1.79 kB 1.92 kB
facebook-www/ReactDOMServer-prod.modern.js +3.83% 68.41 kB 71.03 kB +6.70% 14.35 kB 15.31 kB
facebook-www/ReactFlightDOMRelayServer-prod.classic.js +3.28% 15.28 kB 15.79 kB +3.57% 3.98 kB 4.12 kB
facebook-www/ReactFlightDOMRelayServer-prod.modern.js +3.28% 15.28 kB 15.79 kB +3.57% 3.98 kB 4.12 kB
oss-experimental/react-fetch/cjs/react-fetch.browser.development.js +2.05% 3.32 kB 3.39 kB +3.18% 1.10 kB 1.14 kB
oss-stable-semver/react-fetch/cjs/react-fetch.browser.development.js +2.05% 3.32 kB 3.39 kB +3.18% 1.10 kB 1.14 kB
oss-stable/react-fetch/cjs/react-fetch.browser.development.js +2.05% 3.32 kB 3.39 kB +3.18% 1.10 kB 1.14 kB
oss-experimental/react-cache/cjs/react-cache.development.js +1.71% 8.47 kB 8.61 kB +2.23% 2.83 kB 2.89 kB
oss-stable-semver/react-cache/cjs/react-cache.development.js +1.71% 8.47 kB 8.61 kB +2.23% 2.83 kB 2.89 kB
oss-stable/react-cache/cjs/react-cache.development.js +1.71% 8.47 kB 8.61 kB +2.23% 2.83 kB 2.89 kB
oss-experimental/react-fetch/cjs/react-fetch.node.development.js +1.33% 4.98 kB 5.05 kB +2.05% 1.56 kB 1.60 kB
oss-stable-semver/react-fetch/cjs/react-fetch.node.development.js +1.33% 4.98 kB 5.05 kB +2.05% 1.56 kB 1.60 kB
oss-stable/react-fetch/cjs/react-fetch.node.development.js +1.33% 4.98 kB 5.05 kB +2.05% 1.56 kB 1.60 kB
facebook-www/ReactFlightDOMRelayClient-dev.classic.js +0.48% 12.00 kB 12.06 kB +0.60% 3.52 kB 3.54 kB
facebook-www/ReactFlightDOMRelayClient-dev.modern.js +0.48% 12.00 kB 12.06 kB +0.60% 3.52 kB 3.54 kB
facebook-relay/flight/ReactFlightNativeRelayClient-dev.js +0.48% 12.01 kB 12.07 kB +0.60% 3.51 kB 3.53 kB
oss-experimental/react-client/cjs/react-client-flight.development.js +0.38% 14.63 kB 14.69 kB +0.49% 4.29 kB 4.31 kB
oss-stable-semver/react-client/cjs/react-client-flight.development.js +0.38% 14.63 kB 14.69 kB +0.49% 4.29 kB 4.31 kB
oss-stable/react-client/cjs/react-client-flight.development.js +0.38% 14.63 kB 14.69 kB +0.49% 4.29 kB 4.31 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack.development.js +0.34% 17.18 kB 17.24 kB +0.49% 4.92 kB 4.95 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack.development.js +0.34% 17.18 kB 17.24 kB +0.49% 4.92 kB 4.95 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack.development.js +0.34% 17.18 kB 17.24 kB +0.49% 4.92 kB 4.95 kB
oss-experimental/react-server-dom-webpack/umd/react-server-dom-webpack.development.js +0.33% 18.42 kB 18.48 kB +0.48% 5.04 kB 5.07 kB
oss-stable-semver/react-server-dom-webpack/umd/react-server-dom-webpack.development.js +0.33% 18.42 kB 18.48 kB +0.48% 5.04 kB 5.07 kB
oss-stable/react-server-dom-webpack/umd/react-server-dom-webpack.development.js +0.33% 18.42 kB 18.48 kB +0.48% 5.04 kB 5.07 kB
facebook-relay/flight/ReactFlightNativeRelayServer-prod.js +0.25% 15.73 kB 15.77 kB +0.20% 4.10 kB 4.11 kB
facebook-relay/flight/ReactFlightNativeRelayServer-dev.js +0.25% 28.16 kB 28.23 kB +0.27% 7.37 kB 7.39 kB
facebook-react-native/react-test-renderer/cjs/ReactTestRenderer-dev.js +0.24% 630.18 kB 631.72 kB +0.25% 136.39 kB 136.73 kB
react-native/implementations/ReactFabric-dev.js +0.23% 721.08 kB 722.73 kB +0.28% 156.35 kB 156.79 kB
react-native/implementations/ReactNativeRenderer-dev.fb.js +0.23% 756.52 kB 758.24 kB +0.29% 163.52 kB 163.99 kB
react-native/implementations/ReactNativeRenderer-dev.js +0.23% 738.42 kB 740.10 kB +0.30% 160.22 kB 160.70 kB
react-native/implementations/ReactFabric-dev.fb.js +0.22% 741.19 kB 742.84 kB +0.27% 160.10 kB 160.53 kB
oss-experimental/react-test-renderer/cjs/react-test-renderer.production.min.js = 82.24 kB 82.07 kB = 25.41 kB 25.31 kB
oss-experimental/react-test-renderer/umd/react-test-renderer.production.min.js = 82.43 kB 82.25 kB = 25.84 kB 25.73 kB
oss-stable-semver/react-test-renderer/umd/react-test-renderer.production.min.js = 80.05 kB 79.87 kB = 24.99 kB 24.88 kB
oss-stable/react-test-renderer/umd/react-test-renderer.production.min.js = 80.05 kB 79.87 kB = 24.99 kB 24.88 kB
oss-stable-semver/react-test-renderer/cjs/react-test-renderer.production.min.js = 79.86 kB 79.68 kB = 24.67 kB 24.56 kB
oss-stable/react-test-renderer/cjs/react-test-renderer.production.min.js = 79.86 kB 79.68 kB = 24.67 kB 24.56 kB
oss-experimental/react-reconciler/cjs/react-reconciler.profiling.min.js = 102.64 kB 102.41 kB = 31.36 kB 31.21 kB
oss-experimental/react-art/cjs/react-art.production.min.js = 85.47 kB 85.28 kB = 26.49 kB 26.35 kB
oss-stable-semver/react-reconciler/cjs/react-reconciler.profiling.min.js = 100.16 kB 99.93 kB = 30.61 kB 30.45 kB
oss-stable/react-reconciler/cjs/react-reconciler.profiling.min.js = 100.16 kB 99.93 kB = 30.61 kB 30.45 kB
oss-stable-semver/react-art/cjs/react-art.production.min.js = 83.08 kB 82.88 kB = 25.70 kB 25.57 kB
oss-stable/react-art/cjs/react-art.production.min.js = 83.08 kB 82.88 kB = 25.70 kB 25.57 kB
oss-experimental/react-dom/umd/react-dom-test-utils.development.js = 60.42 kB 60.27 kB +0.08% 16.86 kB 16.88 kB
oss-stable-semver/react-dom/umd/react-dom-test-utils.development.js = 60.42 kB 60.27 kB +0.08% 16.86 kB 16.88 kB
oss-stable/react-dom/umd/react-dom-test-utils.development.js = 60.42 kB 60.27 kB +0.08% 16.86 kB 16.88 kB
facebook-www/React-prod.classic.js = 17.50 kB 17.44 kB = 4.47 kB 4.47 kB
facebook-www/React-profiling.classic.js = 17.50 kB 17.44 kB = 4.47 kB 4.47 kB
facebook-www/React-prod.modern.js = 17.35 kB 17.30 kB = 4.43 kB 4.42 kB
facebook-www/React-profiling.modern.js = 17.35 kB 17.30 kB = 4.43 kB 4.42 kB
facebook-www/ReactDOMServer-dev.modern.js = 218.86 kB 218.16 kB = 51.81 kB 51.77 kB
oss-stable-semver/react-server/cjs/react-server.development.js = 115.91 kB 115.53 kB = 28.46 kB 28.44 kB
oss-stable/react-server/cjs/react-server.development.js = 115.91 kB 115.53 kB = 28.46 kB 28.44 kB
facebook-www/ReactTestUtils-dev.classic.js = 51.53 kB 51.35 kB = 14.40 kB 14.39 kB
facebook-www/ReactTestUtils-dev.modern.js = 51.53 kB 51.35 kB = 14.41 kB 14.40 kB
oss-experimental/react-server/cjs/react-server.development.js = 116.47 kB 116.05 kB = 28.61 kB 28.58 kB
oss-stable-semver/react-dom/cjs/react-dom-server-legacy.node.development.js = 221.16 kB 220.27 kB = 53.22 kB 53.16 kB
oss-stable/react-dom/cjs/react-dom-server-legacy.node.development.js = 221.16 kB 220.27 kB = 53.22 kB 53.16 kB
oss-stable-semver/react-dom/cjs/react-dom-server.browser.development.js = 217.00 kB 216.11 kB = 52.43 kB 52.37 kB
oss-stable/react-dom/cjs/react-dom-server.browser.development.js = 217.00 kB 216.11 kB = 52.43 kB 52.37 kB
oss-stable-semver/react-dom/cjs/react-dom-server.node.development.js = 216.91 kB 216.02 kB = 52.29 kB 52.23 kB
oss-stable/react-dom/cjs/react-dom-server.node.development.js = 216.91 kB 216.02 kB = 52.29 kB 52.23 kB
oss-stable-semver/react-dom/cjs/react-dom-server-legacy.browser.development.js = 219.58 kB 218.65 kB = 52.78 kB 52.72 kB
oss-stable/react-dom/cjs/react-dom-server-legacy.browser.development.js = 219.58 kB 218.65 kB = 52.78 kB 52.72 kB
oss-experimental/react-dom/cjs/react-dom-server-legacy.node.development.js = 221.73 kB 220.79 kB = 53.37 kB 53.31 kB
oss-experimental/react-dom/cjs/react-dom-server.browser.development.js = 217.57 kB 216.63 kB = 52.58 kB 52.52 kB
oss-experimental/react-dom/cjs/react-dom-server.node.development.js = 217.48 kB 216.54 kB = 52.45 kB 52.38 kB
oss-experimental/react-dom/cjs/react-dom-server-legacy.browser.development.js = 220.16 kB 219.18 kB = 52.94 kB 52.87 kB
oss-stable-semver/react-dom/umd/react-dom-server.browser.development.js = 228.03 kB 226.94 kB = 53.03 kB 52.95 kB
oss-stable/react-dom/umd/react-dom-server.browser.development.js = 228.03 kB 226.94 kB = 53.03 kB 52.95 kB
oss-stable-semver/react-dom/umd/react-dom-server-legacy.browser.development.js = 230.79 kB 229.64 kB = 53.40 kB 53.31 kB
oss-stable/react-dom/umd/react-dom-server-legacy.browser.development.js = 230.79 kB 229.64 kB = 53.40 kB 53.31 kB
oss-experimental/create-subscription/cjs/create-subscription.development.js = 5.82 kB 5.79 kB = 2.11 kB 2.10 kB
oss-stable-semver/create-subscription/cjs/create-subscription.development.js = 5.82 kB 5.79 kB = 2.11 kB 2.10 kB
oss-stable/create-subscription/cjs/create-subscription.development.js = 5.82 kB 5.79 kB = 2.11 kB 2.10 kB
oss-experimental/react-dom/umd/react-dom-server.browser.development.js = 228.65 kB 227.49 kB = 53.19 kB 53.10 kB
oss-experimental/react-dom/umd/react-dom-server-legacy.browser.development.js = 231.41 kB 230.20 kB = 53.55 kB 53.46 kB
oss-experimental/react-reconciler/cjs/react-reconciler-reflection.development.js = 19.43 kB 19.30 kB = 5.60 kB 5.59 kB
oss-stable-semver/react-reconciler/cjs/react-reconciler-reflection.development.js = 19.43 kB 19.30 kB = 5.60 kB 5.59 kB
oss-stable/react-reconciler/cjs/react-reconciler-reflection.development.js = 19.43 kB 19.30 kB = 5.60 kB 5.59 kB
facebook-www/ReactFlightDOMRelayServer-dev.classic.js = 28.35 kB 28.11 kB = 7.30 kB 7.30 kB
facebook-www/ReactFlightDOMRelayServer-dev.modern.js = 28.35 kB 28.11 kB = 7.30 kB 7.30 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-writer.browser.development.server.js = 28.32 kB 28.06 kB = 7.68 kB 7.67 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-writer.browser.development.server.js = 28.32 kB 28.06 kB = 7.68 kB 7.67 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-writer.browser.development.server.js = 28.32 kB 28.06 kB = 7.68 kB 7.67 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-writer.node.development.server.js = 28.21 kB 27.95 kB = 7.51 kB 7.50 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-writer.node.development.server.js = 28.21 kB 27.95 kB = 7.51 kB 7.50 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-writer.node.development.server.js = 28.21 kB 27.95 kB = 7.51 kB 7.50 kB
oss-experimental/react-server/cjs/react-server-flight.development.js = 27.77 kB 27.52 kB = 7.39 kB 7.38 kB
oss-stable-semver/react-server/cjs/react-server-flight.development.js = 27.77 kB 27.52 kB = 7.39 kB 7.38 kB
oss-stable/react-server/cjs/react-server-flight.development.js = 27.77 kB 27.52 kB = 7.39 kB 7.38 kB
oss-experimental/react-server-dom-webpack/umd/react-server-dom-webpack-writer.browser.development.server.js = 30.10 kB 29.77 kB = 7.83 kB 7.81 kB
oss-stable-semver/react-server-dom-webpack/umd/react-server-dom-webpack-writer.browser.development.server.js = 30.10 kB 29.77 kB = 7.83 kB 7.81 kB
oss-stable/react-server-dom-webpack/umd/react-server-dom-webpack-writer.browser.development.server.js = 30.10 kB 29.77 kB = 7.83 kB 7.81 kB
oss-experimental/react-pg/cjs/react-pg.node.development.server.js = 2.95 kB 2.89 kB = 1.17 kB 1.16 kB
oss-stable-semver/react-pg/cjs/react-pg.node.development.server.js = 2.95 kB 2.89 kB = 1.17 kB 1.16 kB
oss-stable/react-pg/cjs/react-pg.node.development.server.js = 2.95 kB 2.89 kB = 1.17 kB 1.16 kB
oss-experimental/jest-react/cjs/jest-react.production.min.js = 2.62 kB 2.40 kB = 1.30 kB 1.18 kB
oss-stable-semver/jest-react/cjs/jest-react.production.min.js = 2.62 kB 2.40 kB = 1.30 kB 1.18 kB
oss-stable/jest-react/cjs/jest-react.production.min.js = 2.62 kB 2.40 kB = 1.30 kB 1.18 kB
oss-experimental/react-suspense-test-utils/cjs/react-suspense-test-utils.js = 2.65 kB 2.15 kB = 1.10 kB 0.86 kB
oss-stable-semver/react-suspense-test-utils/cjs/react-suspense-test-utils.js = 2.65 kB 2.15 kB = 1.10 kB 0.86 kB
oss-stable/react-suspense-test-utils/cjs/react-suspense-test-utils.js = 2.65 kB 2.15 kB = 1.10 kB 0.86 kB

Generated by 🚫 dangerJS against 3ed2d03

@acdlite
Copy link
Collaborator Author

acdlite commented Sep 27, 2021

The reason the Node build of react-fetch increased in size is because it contains a single error that previously wasn't being minified. But now it is: #22428 (comment)

And because it's the only minified error in that package, pulling in formatProdErrorMessage increases the overall size because there aren't other errors to amortize the cost.

@acdlite acdlite force-pushed the codemod-invariant branch 6 times, most recently from 18e317b to ebb6914 Compare September 30, 2021 15:28
Copy link
Member

@rickhanlonii rickhanlonii left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm +1 but as mentioned on the other PR, it's seems hard to disambiguate between errors that are minified and one's that are ignored. What about either an opt-in, like throw MinifiedError() or opt-out with throw UnminifiedError().

@acdlite
Copy link
Collaborator Author

acdlite commented Sep 30, 2021

Replied here: #22429 (comment)

[...] we're not super consistent about which errors we minify and which ones we don't, because there's no existing lint rule that enforces it either way.

The first step should be to decide which packages should have minified error messages. I think probably everything that runs in the browser, but not stuff that runs elsewhere. For RN we don't minify currently, which I suppose makes sense since React itself is never downloaded OTA (I think?).

If there are exceptions after that we can consider adding an escape hatch, though I would still prefer an inline comment directive (like // no-minify-error-message or something) since it doesn't have runtime implications and we can adapt it to work with any Error subclass, like TypeError for example.

When this code was written, the error codes map (`codes.json`) was
created on-the-fly, so we had to lazily require from inside the visitor.

Because `codes.json` is now checked into source, we can import it a
single time in module scope.
We use a script to minify our error messages in production. Each message
is assigned an error code, defined in `scripts/error-codes/codes.json`.
Then our build script replaces the messages with a link to our
error decoder page, e.g. https://reactjs.org/docs/error-decoder.html/?invariant=92

This enables us to write helpful error messages without increasing the
bundle size.

Right now, the script only works for `invariant` calls. It does not work
if you throw an Error object. This is an old Facebookism that we don't
really need, other than the fact that our error minification script
relies on it.

So, I've updated the script to minify error constructors, too:

Input:
  Error(`A ${adj} message that contains ${noun}`);
Output:
  Error(formatProdErrorMessage(ERR_CODE, adj, noun));

It only works for constructors that are literally named Error, though we
could add support for other names, too.

As a next step, I will add a lint rule to enforce that errors written
this way must have a corresponding error code.
This error message wasn't being minified because it doesn't use
invariant. The reason it didn't use invariant is because this particular
error is created without begin thrown — it doesn't need to be thrown
because it's located inside the error handling part of the runtime.

Now that the error minification script supports Error constructors, we
can minify it by assigning it a production error code in
`scripts/error-codes/codes.json`.

To support the use of Error constructors more generally, I will add a
lint rule that enforces each message has a corresponding error code.
Adds a lint rule that detects when an Error constructor is used without
a corresponding production error code.

We already have this for `invariant`, but not for regular errors, i.e.
`throw new Error(msg)`. There's also nothing that enforces the use of
`invariant` besides convention.

There are some packages where we don't care to minify errors. These are
packages that run in environments where bundle size is not a concern,
like react-pg. I added an override in the ESLint config to ignore these.
I'm adding this codemod to the repo temporarily, but I'll revert it
in the same PR. That way we don't have to check it in but it's still
accessible (via the PR) if we need it later.
This commit contains only automated changes:

npx jscodeshift -t scripts/codemod-invariant.js packages --ignore-pattern="node_modules/**/*"
yarn linc --fix
yarn prettier

I will do any manual touch ups in separate commits so they're easier
to review.
This reverts the codemod script and ESLint config I added temporarily
in order to perform the invariant codemod.
A few manual changes I made after the codemod ran.
Currently we're not consistent about which packages should have their
errors minified in production and which ones should.

This adds a field to the bundle configuration to control whether to
apply the transform. We should decide what the criteria is going
forward. I think it's probably a good idea to minify any package that
gets sent over the network. So yes to modules that run in the browser,
and no to modules that run on the server and during development only.
@acdlite acdlite merged commit a724a3b into facebook:main Sep 30, 2021
facebook-github-bot pushed a commit to facebook/react-native that referenced this pull request Oct 12, 2021
Summary:
This sync includes the following changes:
- **[579c008a7](facebook/react@579c008a7 )**: [Fizz/Flight] pipeToNodeWritable(..., writable).startWriting() -> renderToPipeableStream(...).pipe(writable) ([#22450](facebook/react#22450)) //<Sebastian Markbåge>//
- **[f2c381131](facebook/react@f2c381131 )**: fix: useSyncExternalStoreExtra ([#22500](facebook/react#22500)) //<Daishi Kato>//
- **[0ecbbe142](facebook/react@0ecbbe142 )**: Sync hydrate discrete events in capture phase and dont replay discrete events ([#22448](facebook/react#22448)) //<salazarm>//
- **[a724a3b57](facebook/react@a724a3b57 )**: [RFC] Codemod invariant -> throw new Error ([#22435](facebook/react#22435)) //<Andrew Clark>//
- **[201af81b0](facebook/react@201af81b0 )**: Release pooled cache reference in complete/unwind ([#22464](facebook/react#22464)) //<Joseph Savona>//
- **[033efe731](facebook/react@033efe731 )**: Call get snapshot in useSyncExternalStore server shim ([#22453](facebook/react#22453)) //<salazarm>//
- **[7843b142a](facebook/react@7843b142a )**: [Fizz/Flight] Pass in Destination lazily to startFlowing instead of in createRequest ([#22449](facebook/react#22449)) //<Sebastian Markbåge>//
- **[d9fb383d6](facebook/react@d9fb383d6 )**: Extract queueing logic into shared functions ([#22452](facebook/react#22452)) //<Andrew Clark>//
- **[9175f4d15](facebook/react@9175f4d15 )**: Scheduling Profiler: Show Suspense resource .displayName ([#22451](facebook/react#22451)) //<Brian Vaughn>//
- **[eba248c39](facebook/react@eba248c39 )**: [Fizz/Flight] Remove reentrancy hack ([#22446](facebook/react#22446)) //<Sebastian Markbåge>//
- **[66388150e](facebook/react@66388150e )**: Remove usereducer eager bailout ([#22445](facebook/react#22445)) //<Joseph Savona>//
- **[d3e086932](facebook/react@d3e086932 )**: Make root.unmount() synchronous  ([#22444](facebook/react#22444)) //<Andrew Clark>//
- **[2cc6d79c9](facebook/react@2cc6d79c9 )**: Rename onReadyToStream to onCompleteShell ([#22443](facebook/react#22443)) //<Sebastian Markbåge>//
- **[c88fb49d3](facebook/react@c88fb49d3 )**: Improve DEV errors if string coercion throws (Temporal.*, Symbol, etc.) ([#22064](facebook/react#22064)) //<Justin Grant>//
- **[05726d72c](facebook/react@05726d72c )**: [Fix] Errors should not "unsuspend" a transition ([#22423](facebook/react#22423)) //<Andrew Clark>//
- **[3746eaf98](facebook/react@3746eaf98 )**: Packages/React/src/ReactLazy ---> changing -1 to unintialized ([#22421](facebook/react#22421)) //<BIKI DAS>//
- **[04ccc01d9](facebook/react@04ccc01d9 )**: Hydration errors should force a client render ([#22416](facebook/react#22416)) //<Andrew Clark>//
- **[029fdcebb](facebook/react@029fdcebb )**: root.hydrate -> root.isDehydrated ([#22420](facebook/react#22420)) //<Andrew Clark>//
- **[af87f5a83](facebook/react@af87f5a83 )**: Scheduling Profiler marks should include thrown Errors ([#22417](facebook/react#22417)) //<Brian Vaughn>//
- **[d47339ea3](facebook/react@d47339ea3 )**: [Fizz] Remove assignID mechanism ([#22410](facebook/react#22410)) //<Sebastian Markbåge>//
- **[3a50d9557](facebook/react@3a50d9557 )**: Never attach ping listeners in legacy Suspense ([#22407](facebook/react#22407)) //<Andrew Clark>//
- **[82c8fa90b](facebook/react@82c8fa90b )**: Add back useMutableSource temporarily ([#22396](facebook/react#22396)) //<Andrew Clark>//
- **[5b57bc6e3](facebook/react@5b57bc6e3 )**: [Draft] don't patch console during first render ([#22308](facebook/react#22308)) //<Luna Ruan>//
- **[cf07c3df1](facebook/react@cf07c3df1 )**: Delete all but one `build2` reference ([#22391](facebook/react#22391)) //<Andrew Clark>//
- **[bb0d06935](facebook/react@bb0d06935 )**: [build2 -> build] Local scripts //<Andrew Clark>//
- **[0c81d347b](facebook/react@0c81d347b )**: Write artifacts to `build` instead of `build2` //<Andrew Clark>//
- **[4da03c9fb](facebook/react@4da03c9fb )**: useSyncExternalStore React Native version ([#22367](facebook/react#22367)) //<salazarm>//
- **[48d475c9e](facebook/react@48d475c9e )**: correct typos ([#22294](facebook/react#22294)) //<Bowen>//
- **[cb6c619c0](facebook/react@cb6c619c0 )**: Remove Fiber fields that were used for hydrating useMutableSource ([#22368](facebook/react#22368)) //<Sebastian Silbermann>//
- **[64e70f82e](facebook/react@64e70f82e )**: [Fizz] add avoidThisFallback support ([#22318](facebook/react#22318)) //<salazarm>//
- **[3ee7a004e](facebook/react@3ee7a004e )**: devtools: Display actual ReactDOM API name in root type ([#22363](facebook/react#22363)) //<Sebastian Silbermann>//
- **[79b8fc667](facebook/react@79b8fc667 )**: Implement getServerSnapshot in userspace shim ([#22359](facebook/react#22359)) //<Andrew Clark>//
- **[86b3e2461](facebook/react@86b3e2461 )**: Implement useSyncExternalStore on server ([#22347](facebook/react#22347)) //<Andrew Clark>//
- **[8209de269](facebook/react@8209de269 )**: Delete useMutableSource implementation ([#22292](facebook/react#22292)) //<Andrew Clark>//

Changelog:
[General][Changed] - React Native sync for revisions e8feb11...afcb9cd

jest_e2e[run_all_tests]

Reviewed By: yungsters

Differential Revision: D31541359

fbshipit-source-id: c35941bc303fdf55cb061e9996200dc868a6f2af
externals: ['react', 'react-dom'],
},

// TODO: We don't use this bundle anymore
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@acdlite What do you mean? The Test Selector API kind of stalled but to my knowledge, we still have plans to make use of it. (I'm thinking about potentially using it for DevTools e2e tests at the moment via #22760)

zhengjitf pushed a commit to zhengjitf/react that referenced this pull request Apr 15, 2022
* Hoist error codes import to module scope

When this code was written, the error codes map (`codes.json`) was
created on-the-fly, so we had to lazily require from inside the visitor.

Because `codes.json` is now checked into source, we can import it a
single time in module scope.

* Minify error constructors in production

We use a script to minify our error messages in production. Each message
is assigned an error code, defined in `scripts/error-codes/codes.json`.
Then our build script replaces the messages with a link to our
error decoder page, e.g. https://reactjs.org/docs/error-decoder.html/?invariant=92

This enables us to write helpful error messages without increasing the
bundle size.

Right now, the script only works for `invariant` calls. It does not work
if you throw an Error object. This is an old Facebookism that we don't
really need, other than the fact that our error minification script
relies on it.

So, I've updated the script to minify error constructors, too:

Input:
  Error(`A ${adj} message that contains ${noun}`);
Output:
  Error(formatProdErrorMessage(ERR_CODE, adj, noun));

It only works for constructors that are literally named Error, though we
could add support for other names, too.

As a next step, I will add a lint rule to enforce that errors written
this way must have a corresponding error code.

* Minify "no fallback UI specified" error in prod

This error message wasn't being minified because it doesn't use
invariant. The reason it didn't use invariant is because this particular
error is created without begin thrown — it doesn't need to be thrown
because it's located inside the error handling part of the runtime.

Now that the error minification script supports Error constructors, we
can minify it by assigning it a production error code in
`scripts/error-codes/codes.json`.

To support the use of Error constructors more generally, I will add a
lint rule that enforces each message has a corresponding error code.

* Lint rule to detect unminified errors

Adds a lint rule that detects when an Error constructor is used without
a corresponding production error code.

We already have this for `invariant`, but not for regular errors, i.e.
`throw new Error(msg)`. There's also nothing that enforces the use of
`invariant` besides convention.

There are some packages where we don't care to minify errors. These are
packages that run in environments where bundle size is not a concern,
like react-pg. I added an override in the ESLint config to ignore these.

* Temporarily add invariant codemod script

I'm adding this codemod to the repo temporarily, but I'll revert it
in the same PR. That way we don't have to check it in but it's still
accessible (via the PR) if we need it later.

* [Automated] Codemod invariant -> Error

This commit contains only automated changes:

npx jscodeshift -t scripts/codemod-invariant.js packages --ignore-pattern="node_modules/**/*"
yarn linc --fix
yarn prettier

I will do any manual touch ups in separate commits so they're easier
to review.

* Remove temporary codemod script

This reverts the codemod script and ESLint config I added temporarily
in order to perform the invariant codemod.

* Manual touch ups

A few manual changes I made after the codemod ran.

* Enable error code transform per package

Currently we're not consistent about which packages should have their
errors minified in production and which ones should.

This adds a field to the bundle configuration to control whether to
apply the transform. We should decide what the criteria is going
forward. I think it's probably a good idea to minify any package that
gets sent over the network. So yes to modules that run in the browser,
and no to modules that run on the server and during development only.
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.

5 participants