[Flight/Fizz] Reset ThenableState Only in Branches Where It's Added #28068

sebmarkbage · 2024-01-24T05:41:30Z

Before, we used to reset the thenable state and extract the previous state very early so that it's only the retried task that can possibly consume it. This is nice because we can't accidentally consume that state for any other node.

However, it does add a lot of branches of code that has to pass this around. It also adds extra bytes on the stack per node. Even though it's mostly just null.

This changes it so that where ever we can create a thenable state (e.g. entering a component with hooks) we first extract this from the task. The principle is that whatever could've created the thenable state in the first place, must always be rerendered so it'll take the same code paths to get there and so we'll always consume it.

react-sizebot · 2024-01-24T05:45:02Z

Comparing: 7724754...88a1be7

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	=	176.34 kB	176.34 kB	=	54.93 kB	54.93 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js	=	178.44 kB	178.44 kB	=	55.57 kB	55.57 kB
facebook-www/ReactDOM-prod.classic.js	=	572.79 kB	572.79 kB	=	100.80 kB	100.80 kB
facebook-www/ReactDOM-prod.modern.js	=	556.55 kB	556.55 kB	=	97.88 kB	97.88 kB
test_utils/ReactAllWarnings.js	Deleted	67.55 kB	0.00 kB	Deleted	16.54 kB	0.00 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show

Name	+/-	Base	Current	+/- gzip	Base gzip	Current gzip
oss-stable-semver/react-server/cjs/react-server-flight.production.js	+0.31%	57.68 kB	57.86 kB	+0.15%	14.04 kB	14.06 kB
oss-stable/react-server/cjs/react-server-flight.production.js	+0.31%	57.68 kB	57.86 kB	+0.15%	14.04 kB	14.06 kB
oss-stable-semver/react-server/cjs/react-server-flight.development.js	+0.27%	66.44 kB	66.62 kB	+0.04%	16.07 kB	16.07 kB
oss-stable/react-server/cjs/react-server-flight.development.js	+0.27%	66.44 kB	66.62 kB	+0.04%	16.07 kB	16.07 kB
oss-experimental/react-server/cjs/react-server-flight.production.js	+0.26%	68.40 kB	68.58 kB	+0.07%	16.13 kB	16.14 kB
oss-experimental/react-server/cjs/react-server-flight.development.js	+0.23%	79.35 kB	79.53 kB	+0.02%	18.72 kB	18.73 kB
oss-experimental/react-dom/cjs/react-dom-server.edge.production.js	=	343.26 kB	342.46 kB	=	73.96 kB	73.89 kB
oss-experimental/react-dom/cjs/react-dom-server.node.production.js	=	341.10 kB	340.29 kB	=	72.95 kB	72.89 kB
oss-experimental/react-dom/cjs/react-dom-server.browser.production.js	=	338.75 kB	337.94 kB	=	72.51 kB	72.45 kB
oss-experimental/react-dom/cjs/react-dom-server-legacy.node.production.js	=	336.26 kB	335.45 kB	=	73.29 kB	73.22 kB
oss-experimental/react-dom/cjs/react-dom-server-legacy.browser.production.js	=	330.08 kB	329.28 kB	=	71.39 kB	71.34 kB
oss-experimental/react-dom/cjs/react-dom-server.bun.production.js	=	328.21 kB	327.41 kB	=	70.94 kB	70.88 kB
oss-stable/react-dom/cjs/react-dom-server-legacy.node.production.js	=	325.05 kB	324.24 kB	=	71.31 kB	71.26 kB
oss-stable-semver/react-dom/cjs/react-dom-server-legacy.node.production.js	=	325.02 kB	324.22 kB	=	71.28 kB	71.23 kB
oss-stable/react-dom/cjs/react-dom-server.edge.production.js	=	322.79 kB	321.98 kB	=	71.01 kB	70.97 kB
oss-stable-semver/react-dom/cjs/react-dom-server.edge.production.js	=	322.76 kB	321.96 kB	=	70.98 kB	70.94 kB
oss-stable/react-dom/cjs/react-dom-server.node.production.js	=	321.16 kB	320.36 kB	=	69.73 kB	69.69 kB
oss-stable-semver/react-dom/cjs/react-dom-server.node.production.js	=	321.14 kB	320.33 kB	=	69.70 kB	69.66 kB
oss-stable/react-dom/cjs/react-dom-server-legacy.browser.production.js	=	319.18 kB	318.37 kB	=	69.53 kB	69.48 kB
oss-stable-semver/react-dom/cjs/react-dom-server-legacy.browser.production.js	=	319.15 kB	318.35 kB	=	69.50 kB	69.45 kB
oss-stable/react-dom/cjs/react-dom-server.browser.production.js	=	318.58 kB	317.78 kB	=	69.67 kB	69.61 kB
oss-stable-semver/react-dom/cjs/react-dom-server.browser.production.js	=	318.55 kB	317.75 kB	=	69.64 kB	69.59 kB
oss-stable/react-dom/cjs/react-dom-server.bun.production.js	=	317.00 kB	316.20 kB	=	68.96 kB	68.91 kB
oss-stable-semver/react-dom/cjs/react-dom-server.bun.production.js	=	316.98 kB	316.17 kB	=	68.93 kB	68.89 kB
facebook-www/ReactFlightDOMServer-dev.modern.js	=	81.76 kB	81.54 kB	=	17.41 kB	17.37 kB
oss-experimental/react-server/cjs/react-server.production.min.js	=	41.22 kB	41.08 kB	=	12.93 kB	12.92 kB
oss-experimental/react-server/cjs/react-server.development.js	=	210.59 kB	209.79 kB	=	49.00 kB	48.94 kB
oss-stable-semver/react-server/cjs/react-server.production.min.js	=	38.26 kB	38.11 kB	=	12.21 kB	12.15 kB
oss-stable/react-server/cjs/react-server.production.min.js	=	38.26 kB	38.11 kB	=	12.21 kB	12.15 kB
oss-stable-semver/react-server/cjs/react-server.development.js	=	199.99 kB	199.19 kB	=	47.16 kB	47.11 kB
oss-stable/react-server/cjs/react-server.development.js	=	199.99 kB	199.19 kB	=	47.16 kB	47.11 kB
facebook-www/ReactDOMServer-dev.classic.js	=	483.12 kB	481.05 kB	=	98.41 kB	98.26 kB
facebook-www/ReactDOMServer-dev.modern.js	=	474.67 kB	472.61 kB	=	96.75 kB	96.57 kB
facebook-www/ReactDOMServerStreaming-dev.modern.js	=	467.32 kB	465.26 kB	=	95.11 kB	94.92 kB
oss-experimental/react-server/cjs/react-server.production.js	=	167.12 kB	166.31 kB	=	38.54 kB	38.48 kB
oss-stable-semver/react-server/cjs/react-server.production.js	=	156.47 kB	155.67 kB	=	36.68 kB	36.64 kB
oss-stable/react-server/cjs/react-server.production.js	=	156.47 kB	155.67 kB	=	36.68 kB	36.64 kB
facebook-www/ReactDOMServer-prod.classic.js	=	201.57 kB	199.99 kB	=	36.45 kB	36.25 kB
facebook-www/ReactFlightDOMServer-prod.modern.js	=	38.88 kB	38.41 kB	=	8.71 kB	8.66 kB
test_utils/ReactAllWarnings.js	Deleted	67.55 kB	0.00 kB	Deleted	16.54 kB	0.00 kB

Generated by 🚫 dangerJS against 88a1be7

Instead, pick it up from the task. The idea is that any retry with thenable state, must recall a component that used the use() Hook. During that recall, it'll always be consumed and reset to null. So anything that sets up new thenable state must also consume it.

…28068) Before, we used to reset the thenable state and extract the previous state very early so that it's only the retried task that can possibly consume it. This is nice because we can't accidentally consume that state for any other node. However, it does add a lot of branches of code that has to pass this around. It also adds extra bytes on the stack per node. Even though it's mostly just null. This changes it so that where ever we can create a thenable state (e.g. entering a component with hooks) we first extract this from the task. The principle is that whatever could've created the thenable state in the first place, must always be rerendered so it'll take the same code paths to get there and so we'll always consume it. DiffTrain build for [382190c](382190c)

…acebook#28068) Before, we used to reset the thenable state and extract the previous state very early so that it's only the retried task that can possibly consume it. This is nice because we can't accidentally consume that state for any other node. However, it does add a lot of branches of code that has to pass this around. It also adds extra bytes on the stack per node. Even though it's mostly just null. This changes it so that where ever we can create a thenable state (e.g. entering a component with hooks) we first extract this from the task. The principle is that whatever could've created the thenable state in the first place, must always be rerendered so it'll take the same code paths to get there and so we'll always consume it.

…28068) Before, we used to reset the thenable state and extract the previous state very early so that it's only the retried task that can possibly consume it. This is nice because we can't accidentally consume that state for any other node. However, it does add a lot of branches of code that has to pass this around. It also adds extra bytes on the stack per node. Even though it's mostly just null. This changes it so that where ever we can create a thenable state (e.g. entering a component with hooks) we first extract this from the task. The principle is that whatever could've created the thenable state in the first place, must always be rerendered so it'll take the same code paths to get there and so we'll always consume it. DiffTrain build for commit 382190c.

facebook-github-bot added CLA Signed React Core Team Opened by a member of the React Core Team labels Jan 24, 2024

sebmarkbage force-pushed the prevthenablestate branch from 8755bd9 to 4a2e55c Compare January 24, 2024 16:10

sebmarkbage requested a review from acdlite January 24, 2024 17:11

acdlite approved these changes Jan 25, 2024

View reviewed changes

sebmarkbage force-pushed the prevthenablestate branch from 4a2e55c to 88a1be7 Compare January 25, 2024 20:25

sebmarkbage merged commit 382190c into facebook:main Jan 26, 2024
36 checks passed

gnoff mentioned this pull request Feb 1, 2024

Update React from 60a927d04 to 2bc7d336a vercel/next.js#61522

Merged

sebmarkbage mentioned this pull request Feb 12, 2024

[Flight] Transfer Debug Info in Server-to-Server Flight Requests #28275

Merged

ztanner mentioned this pull request Mar 19, 2024

(backport) Update React from 60a927d04 to 14898b6a9 vercel/next.js#63442

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Flight/Fizz] Reset ThenableState Only in Branches Where It's Added #28068

[Flight/Fizz] Reset ThenableState Only in Branches Where It's Added #28068

sebmarkbage commented Jan 24, 2024 •

edited

Loading

react-sizebot commented Jan 24, 2024 •

edited

Loading

[Flight/Fizz] Reset ThenableState Only in Branches Where It's Added #28068

[Flight/Fizz] Reset ThenableState Only in Branches Where It's Added #28068

Conversation

sebmarkbage commented Jan 24, 2024 • edited Loading

react-sizebot commented Jan 24, 2024 • edited Loading

Critical size changes

Significant size changes

sebmarkbage commented Jan 24, 2024 •

edited

Loading

react-sizebot commented Jan 24, 2024 •

edited

Loading