Skip to content

[Flight] Include env in ReactAsyncInfo and ReactIOInfo #33400

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

Merged
merged 2 commits into from
Jun 3, 2025

Conversation

sebmarkbage
Copy link
Collaborator

@sebmarkbage sebmarkbage commented Jun 1, 2025

Stacked on #33395.

This lets us keep track of which environment this was fetched and awaited.

Currently the IO and await is in the same environment. It's just kept when forwarded. Once we support forwarding information from a Promise fetched from another environment and awaited in this environment then the await can end up being in a different environment.

There's a question of when the await is inside Flight itself such as when you return a promise fetched from another environment whether that should mean that the await is in the current environment. I don't think so since the original stack trace is the best stack trace. It's only if you await it in user space in this environment first that this might happen and even then it should only be considered if there wasn't a better await earlier or if reading from the other environment was itself I/O.

The timing of when we read environmentName() is a little interesting here too.

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

react-sizebot commented Jun 1, 2025

Comparing: 45da4e0...7254489

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 +0.11% 1.83 kB 1.83 kB
oss-stable/react-dom/cjs/react-dom-client.production.js = 529.82 kB 529.82 kB = 93.51 kB 93.51 kB
oss-experimental/react-dom/cjs/react-dom.production.js = 6.69 kB 6.69 kB +0.11% 1.83 kB 1.83 kB
oss-experimental/react-dom/cjs/react-dom-client.production.js = 650.91 kB 650.91 kB = 114.63 kB 114.64 kB
facebook-www/ReactDOM-prod.classic.js = 675.86 kB 675.86 kB = 118.91 kB 118.92 kB
facebook-www/ReactDOM-prod.modern.js = 666.14 kB 666.14 kB = 117.30 kB 117.30 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-server-dom-esm/cjs/react-server-dom-esm-client.browser.development.js +0.23% 111.62 kB 111.87 kB +0.18% 21.08 kB 21.11 kB
oss-experimental/react-server-dom-parcel/cjs/react-server-dom-parcel-client.browser.development.js +0.23% 111.97 kB 112.23 kB +0.17% 21.02 kB 21.06 kB
oss-experimental/react-client/cjs/react-client-flight.development.js +0.23% 113.27 kB 113.52 kB +0.17% 20.82 kB 20.85 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-client.browser.development.js +0.22% 113.80 kB 114.06 kB +0.17% 21.47 kB 21.50 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-client.browser.development.js +0.22% 114.36 kB 114.61 kB +0.18% 21.60 kB 21.64 kB
oss-experimental/react-server-dom-parcel/cjs/react-server-dom-parcel-client.node.development.js +0.22% 115.70 kB 115.96 kB +0.16% 21.82 kB 21.86 kB
oss-experimental/react-server-dom-esm/cjs/react-server-dom-esm-client.node.development.js +0.22% 116.21 kB 116.47 kB +0.16% 21.86 kB 21.89 kB
oss-experimental/react-server-dom-parcel/cjs/react-server-dom-parcel-client.edge.development.js +0.22% 117.50 kB 117.76 kB +0.18% 22.20 kB 22.24 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-client.node.development.js +0.22% 118.85 kB 119.11 kB +0.17% 22.33 kB 22.37 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-client.edge.development.js +0.21% 120.60 kB 120.85 kB +0.18% 22.70 kB 22.74 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-client.edge.development.js +0.21% 120.69 kB 120.94 kB +0.18% 22.74 kB 22.78 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-client.node.unbundled.development.js +0.21% 121.59 kB 121.85 kB +0.14% 22.61 kB 22.64 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-client.node.development.js +0.21% 122.93 kB 123.18 kB +0.15% 22.86 kB 22.89 kB

Generated by 🚫 dangerJS against 7254489

Hardanish-Singh

This comment was marked as spam.

This lets us keep track of which environment this was fetched and awaited.

Currently the IO and await is in the same environment.

Once we support forwarding information from a Promise fetched from another
environment, the await can end up being in a different environment.
@sebmarkbage sebmarkbage merged commit 157ac57 into facebook:main Jun 3, 2025
177 of 179 checks passed
sebmarkbage added a commit that referenced this pull request Jun 3, 2025
…#33402)

Stacked on #33400. 

<img width="1261" alt="Screenshot 2025-06-01 at 10 27 47 PM"
src="https://github.com/user-attachments/assets/a5a73ee2-49e0-4851-84ac-e0df6032efb5"
/>

This is emitted with the start/end time and stack of the "await". Which
may be different than the thing that started the I/O.

These awaits aren't quite as simple as just every await since you can
start a sequence in parallel there can actually be multiple overlapping
awaits and there can be CPU work interleaved with the await on the same
component.

```js
function getData() {
  await fetch(...);
  await fetch(...);
}
const promise = getData();
doWork();
await promise;
```

This has two "I/O" awaits but those are actually happening in parallel
with `doWork()`.

Since these also could have started before we started rendering this
sequence (e.g. a component) we have to clamp it so that we don't
consider awaits that start before the component.

What we're conceptually trying to convey is the time this component was
blocked due to that I/O resource. Whether it's blocked from completing
the last result or if it's blocked from issuing a waterfall request.
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