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

[Flight] Schedule work in a microtask #29491

Merged
merged 1 commit into from
Jun 6, 2024

Conversation

gnoff
Copy link
Collaborator

@gnoff gnoff commented May 23, 2024

Stacked on #29551

Flight pings much more often than Fizz because async function components will always take at least a microtask to resolve . Rather than scheduling this work as a new macrotask Flight now schedules pings in a microtask. This allows more microtasks to ping before actually doing a work flush but doesn't force the vm to spin up a new task which is quite common give n the nature of Server Components

Copy link

vercel bot commented May 23, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
react-compiler-playground ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jun 6, 2024 5:13pm

Comment on lines 20 to 22
throw new Error(
'Legacy React Server builds should not be using scheduleMicrotask. This is a bug in React.',
);
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

Should environments that previously scheduled all work sync just continue to do sync work? I Should probably rename to scheduleWorkInCurrentTask since it otherwise lies about what it does.

I made this error because we have no legacy builds of flight which is currently the only place this new API is used but this feels pretty inconsistent to me.

Comment on lines 25 to 27
: callback => {
Promise.resolve(null).then(callback).catch(handleErrorInNextTick);
};
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

unlike in Fiber where there is a feature test for Promise I assume here that you must be using an environment with Promise globals. At this point I think we can safely just say React requires promises and since 19 is about to ship maybe we make this breaking change in Fiber too

Comment on lines 25 to 26
export const scheduleMicrotask = queueMicrotask;

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

supported since Node 11 so just not bothering to fall back to Promise

@react-sizebot
Copy link

react-sizebot commented May 23, 2024

Comparing: b526a0a...c2bbe63

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.66 kB 6.66 kB = 1.82 kB 1.82 kB
oss-stable/react-dom/cjs/react-dom-client.production.js = 497.26 kB 497.26 kB = 89.11 kB 89.11 kB
oss-experimental/react-dom/cjs/react-dom.production.js = 6.67 kB 6.67 kB = 1.83 kB 1.83 kB
oss-experimental/react-dom/cjs/react-dom-client.production.js = 502.08 kB 502.08 kB = 89.80 kB 89.80 kB
facebook-www/ReactDOM-prod.classic.js = 594.56 kB 594.56 kB = 104.72 kB 104.72 kB
facebook-www/ReactDOM-prod.modern.js = 570.95 kB 570.95 kB = 101.13 kB 101.13 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer-flight-server.production.js +3.45% 2.03 kB 2.10 kB +1.11% 0.72 kB 0.73 kB
oss-stable-rc/react-noop-renderer/cjs/react-noop-renderer-flight-server.production.js +3.45% 2.03 kB 2.10 kB +1.11% 0.72 kB 0.73 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer-flight-server.production.js +3.45% 2.03 kB 2.10 kB +1.11% 0.72 kB 0.73 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer-flight-server.production.js +3.45% 2.03 kB 2.10 kB +1.11% 0.72 kB 0.73 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer-flight-server.development.js +2.66% 2.41 kB 2.47 kB +0.88% 0.91 kB 0.91 kB
oss-stable-rc/react-noop-renderer/cjs/react-noop-renderer-flight-server.development.js +2.66% 2.41 kB 2.47 kB +0.88% 0.91 kB 0.91 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer-flight-server.development.js +2.66% 2.41 kB 2.47 kB +0.88% 0.91 kB 0.91 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer-flight-server.development.js +2.66% 2.41 kB 2.47 kB +0.88% 0.91 kB 0.91 kB
test_utils/ReactAllWarnings.js Deleted 63.89 kB 0.00 kB Deleted 15.97 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-experimental/react-noop-renderer/cjs/react-noop-renderer-flight-server.production.js +3.45% 2.03 kB 2.10 kB +1.11% 0.72 kB 0.73 kB
oss-stable-rc/react-noop-renderer/cjs/react-noop-renderer-flight-server.production.js +3.45% 2.03 kB 2.10 kB +1.11% 0.72 kB 0.73 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer-flight-server.production.js +3.45% 2.03 kB 2.10 kB +1.11% 0.72 kB 0.73 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer-flight-server.production.js +3.45% 2.03 kB 2.10 kB +1.11% 0.72 kB 0.73 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer-flight-server.development.js +2.66% 2.41 kB 2.47 kB +0.88% 0.91 kB 0.91 kB
oss-stable-rc/react-noop-renderer/cjs/react-noop-renderer-flight-server.development.js +2.66% 2.41 kB 2.47 kB +0.88% 0.91 kB 0.91 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer-flight-server.development.js +2.66% 2.41 kB 2.47 kB +0.88% 0.91 kB 0.91 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer-flight-server.development.js +2.66% 2.41 kB 2.47 kB +0.88% 0.91 kB 0.91 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer-server.production.js +1.13% 5.68 kB 5.75 kB +0.75% 1.46 kB 1.47 kB
oss-stable-rc/react-noop-renderer/cjs/react-noop-renderer-server.production.js +1.13% 5.68 kB 5.75 kB +0.75% 1.46 kB 1.47 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer-server.production.js +1.13% 5.68 kB 5.75 kB +0.75% 1.46 kB 1.47 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer-server.production.js +1.13% 5.68 kB 5.75 kB +0.75% 1.46 kB 1.47 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer-server.development.js +1.01% 6.31 kB 6.38 kB +0.47% 1.70 kB 1.70 kB
oss-stable-rc/react-noop-renderer/cjs/react-noop-renderer-server.development.js +1.01% 6.31 kB 6.38 kB +0.47% 1.70 kB 1.70 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer-server.development.js +1.01% 6.31 kB 6.38 kB +0.47% 1.70 kB 1.70 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer-server.development.js +1.01% 6.31 kB 6.38 kB +0.47% 1.70 kB 1.70 kB
oss-stable-rc/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.browser.production.js +0.41% 86.59 kB 86.95 kB +0.57% 17.97 kB 18.07 kB
oss-stable-semver/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.browser.production.js +0.41% 86.59 kB 86.95 kB +0.57% 17.97 kB 18.07 kB
oss-stable/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.browser.production.js +0.41% 86.59 kB 86.95 kB +0.57% 17.97 kB 18.07 kB
oss-stable-rc/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.production.js +0.41% 86.93 kB 87.29 kB +0.64% 18.07 kB 18.19 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.production.js +0.41% 86.93 kB 87.29 kB +0.64% 18.07 kB 18.19 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.production.js +0.41% 86.93 kB 87.29 kB +0.64% 18.07 kB 18.19 kB
oss-stable-rc/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.edge.production.js +0.41% 86.95 kB 87.31 kB +0.64% 18.07 kB 18.18 kB
oss-stable-semver/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.edge.production.js +0.41% 86.95 kB 87.31 kB +0.64% 18.07 kB 18.18 kB
oss-stable/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.edge.production.js +0.41% 86.95 kB 87.31 kB +0.64% 18.07 kB 18.18 kB
oss-stable-rc/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.production.js +0.41% 86.91 kB 87.27 kB +0.57% 18.05 kB 18.16 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.production.js +0.41% 86.91 kB 87.27 kB +0.57% 18.05 kB 18.16 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.production.js +0.41% 86.91 kB 87.27 kB +0.57% 18.05 kB 18.16 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.browser.production.js +0.39% 91.30 kB 91.66 kB +0.56% 18.66 kB 18.77 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.production.js +0.39% 91.72 kB 92.08 kB +0.61% 18.77 kB 18.89 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.edge.production.js +0.39% 91.75 kB 92.11 kB +0.61% 18.77 kB 18.88 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.production.js +0.39% 91.62 kB 91.98 kB +0.55% 18.75 kB 18.86 kB
test_utils/ReactAllWarnings.js Deleted 63.89 kB 0.00 kB Deleted 15.97 kB 0.00 kB

Generated by 🚫 dangerJS against c2bbe63

Flight pings much more often than Fizz because async function components will always take at least a microtask to resolve
. Rather than scheduling this work as a new macrotask Flight now schedules pings in a microtask. This allows more microta
sks to ping before actually doing a work flush but doesn't force the vm to sping up a new task which is quite common give
n the nature of Server Components
@gnoff gnoff force-pushed the microtask-work-in-flight branch from c865358 to c2bbe63 Compare June 6, 2024 17:07
@gnoff gnoff merged commit 1e1e5cd into facebook:main Jun 6, 2024
44 checks passed
@gnoff gnoff deleted the microtask-work-in-flight branch June 6, 2024 17:20
github-actions bot pushed a commit that referenced this pull request Jun 6, 2024
Stacked on #29551

Flight pings much more often than Fizz because async function components
will always take at least a microtask to resolve . Rather than
scheduling this work as a new macrotask Flight now schedules pings in a
microtask. This allows more microtasks to ping before actually doing a
work flush but doesn't force the vm to spin up a new task which is quite
common give n the nature of Server Components

DiffTrain build for commit 1e1e5cd.
gnoff added a commit that referenced this pull request Jun 6, 2024
Stacked on #29491

Previously if you aborted during a render the currently rendering task
would itself be aborted which will cause the entire model to be replaced
by the aborted error rather than just the slot currently being rendered.

This change updates the abort logic to mark currently rendering tasks as
aborted but allowing the current render to emit a partially serialized
model with an error reference in place of the current model.

The intent is to support aborting from rendering synchronously, in
microtasks (after an await or in a .then) and in lazy initializers. We
don't specifically support aborting from things like proxies that might
be triggered during serialization of props
github-actions bot pushed a commit that referenced this pull request Jun 6, 2024
Stacked on #29491

Previously if you aborted during a render the currently rendering task
would itself be aborted which will cause the entire model to be replaced
by the aborted error rather than just the slot currently being rendered.

This change updates the abort logic to mark currently rendering tasks as
aborted but allowing the current render to emit a partially serialized
model with an error reference in place of the current model.

The intent is to support aborting from rendering synchronously, in
microtasks (after an await or in a .then) and in lazy initializers. We
don't specifically support aborting from things like proxies that might
be triggered during serialization of props

DiffTrain build for commit c4b433f.
gnoff added a commit to gnoff/react that referenced this pull request Aug 21, 2024
In facebook#29491 I updated the work scheduler for Flight to use microtasks to perform work when something pings. This is useful but it does have some downsides in terms of our ability to do task prioritization. Additionally the initial work is not instantiated using a microtask which is inconsistent with how pings work.

In this change I update the scheduling logic to use microtasks consistently for prerenders and use regular tasks for renders both for the initial work and pings.
gnoff added a commit to gnoff/react that referenced this pull request Aug 21, 2024
In facebook#29491 I updated the work scheduler for Flight to use microtasks to perform work when something pings. This is useful but it does have some downsides in terms of our ability to do task prioritization. Additionally the initial work is not instantiated using a microtask which is inconsistent with how pings work.

In this change I update the scheduling logic to use microtasks consistently for prerenders and use regular tasks for renders both for the initial work and pings.
gnoff added a commit that referenced this pull request Aug 21, 2024
In #29491 I updated the work
scheduler for Flight to use microtasks to perform work when something
pings. This is useful but it does have some downsides in terms of our
ability to do task prioritization. Additionally the initial work is not
instantiated using a microtask which is inconsistent with how pings
work.

In this change I update the scheduling logic to use microtasks
consistently for prerenders and use regular tasks for renders both for
the initial work and pings.
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.

4 participants