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

Reverse engineer original stack frames when virtual frames are re-serialized #30416

Merged
merged 1 commit into from
Jul 22, 2024

Conversation

sebmarkbage
Copy link
Collaborator

Stacked on #30410.

If we've parsed another RSC stream on the server from a different RSC server, while using findSourceMapURL, the Flight Client ends up adding a rsc://React/ prefix and a numeric suffix to the URL. It's a virtual file that represents the virtual eval:ed frame in that environment.

If we then see that same stack again, we'd serialize a virtual frame to another virtual. Meaning findSourceMapURL on the client would see the virtual frame of the intermediate server and it would have to strip it to figure out what source map to use.

This PR strips it in the Server if we see a virtual frame. At each new client it always refers to the original stack.

We don't have to do this. We could leave it to each findSourceMapURL implementation and captureOwnerStack parser to recursively strip each layer. It could maybe be useful to have the environment name in the virtual frame to know which server to look for the source map in.

@sebmarkbage sebmarkbage requested a review from eps1lon July 22, 2024 01:18
Copy link

vercel bot commented Jul 22, 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 Jul 22, 2024 3:22pm

@react-sizebot
Copy link

react-sizebot commented Jul 22, 2024

Comparing: 0676385...8f0202b

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 = 1.83 kB 1.82 kB
oss-stable/react-dom/cjs/react-dom-client.production.js = 499.44 kB 499.44 kB = 89.59 kB 89.59 kB
oss-experimental/react-dom/cjs/react-dom.production.js = 6.69 kB 6.69 kB = 1.83 kB 1.83 kB
oss-experimental/react-dom/cjs/react-dom-client.production.js = 504.26 kB 504.26 kB = 90.30 kB 90.30 kB
facebook-www/ReactDOM-prod.classic.js = 599.20 kB 599.20 kB = 105.80 kB 105.79 kB
facebook-www/ReactDOM-prod.modern.js = 573.37 kB 573.37 kB = 101.68 kB 101.68 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show
Name +/- Base Current +/- gzip Base gzip Current gzip
oss-stable-rc/react-server/cjs/react-server-flight.development.js +0.49% 82.39 kB 82.79 kB +0.74% 15.48 kB 15.59 kB
oss-stable-semver/react-server/cjs/react-server-flight.development.js +0.49% 82.39 kB 82.79 kB +0.74% 15.48 kB 15.59 kB
oss-stable/react-server/cjs/react-server-flight.development.js +0.49% 82.39 kB 82.79 kB +0.74% 15.48 kB 15.59 kB
oss-experimental/react-server/cjs/react-server-flight.development.js +0.36% 96.02 kB 96.37 kB +0.52% 17.84 kB 17.94 kB
oss-stable-rc/react-server-dom-esm/cjs/react-server-dom-esm-server.node.development.js +0.33% 122.39 kB 122.79 kB +0.47% 23.01 kB 23.12 kB
oss-stable-semver/react-server-dom-esm/cjs/react-server-dom-esm-server.node.development.js +0.33% 122.39 kB 122.79 kB +0.47% 23.01 kB 23.12 kB
oss-stable/react-server-dom-esm/cjs/react-server-dom-esm-server.node.development.js +0.33% 122.39 kB 122.79 kB +0.47% 23.01 kB 23.12 kB
oss-stable-rc/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.browser.development.js +0.32% 126.13 kB 126.53 kB +0.47% 23.60 kB 23.71 kB
oss-stable-semver/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.browser.development.js +0.32% 126.13 kB 126.53 kB +0.47% 23.60 kB 23.71 kB
oss-stable/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.browser.development.js +0.32% 126.13 kB 126.53 kB +0.47% 23.60 kB 23.71 kB
oss-stable-rc/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.development.js +0.32% 126.75 kB 127.15 kB +0.48% 23.79 kB 23.90 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.development.js +0.32% 126.75 kB 127.15 kB +0.48% 23.79 kB 23.90 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.development.js +0.32% 126.75 kB 127.15 kB +0.48% 23.79 kB 23.90 kB
oss-stable-rc/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.edge.development.js +0.32% 127.30 kB 127.70 kB +0.50% 23.81 kB 23.92 kB
oss-stable-semver/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.edge.development.js +0.32% 127.30 kB 127.70 kB +0.50% 23.81 kB 23.92 kB
oss-stable/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.edge.development.js +0.32% 127.30 kB 127.70 kB +0.50% 23.81 kB 23.92 kB
oss-stable-rc/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js +0.32% 127.45 kB 127.85 kB +0.49% 23.88 kB 23.99 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js +0.32% 127.45 kB 127.85 kB +0.49% 23.88 kB 23.99 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js +0.32% 127.45 kB 127.85 kB +0.49% 23.88 kB 23.99 kB
oss-stable-rc/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.node.unbundled.development.js +0.31% 128.75 kB 129.16 kB +0.46% 23.97 kB 24.08 kB
oss-stable-semver/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.node.unbundled.development.js +0.31% 128.75 kB 129.16 kB +0.46% 23.97 kB 24.08 kB
oss-stable/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.node.unbundled.development.js +0.31% 128.75 kB 129.16 kB +0.46% 23.97 kB 24.08 kB
oss-stable-rc/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.unbundled.development.js +0.31% 128.91 kB 129.32 kB +0.46% 24.03 kB 24.14 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.unbundled.development.js +0.31% 128.91 kB 129.32 kB +0.46% 24.03 kB 24.14 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.unbundled.development.js +0.31% 128.91 kB 129.32 kB +0.46% 24.03 kB 24.14 kB
oss-stable-rc/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.node.development.js +0.31% 129.86 kB 130.26 kB +0.48% 24.24 kB 24.36 kB
oss-stable-semver/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.node.development.js +0.31% 129.86 kB 130.26 kB +0.48% 24.24 kB 24.36 kB
oss-stable/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.node.development.js +0.31% 129.86 kB 130.26 kB +0.48% 24.24 kB 24.36 kB
oss-stable-rc/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.development.js +0.31% 130.01 kB 130.41 kB +0.47% 24.31 kB 24.42 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.development.js +0.31% 130.01 kB 130.41 kB +0.47% 24.31 kB 24.42 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.development.js +0.31% 130.01 kB 130.41 kB +0.47% 24.31 kB 24.42 kB
oss-experimental/react-server-dom-esm/cjs/react-server-dom-esm-server.node.development.js +0.26% 136.50 kB 136.85 kB +0.37% 25.49 kB 25.58 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.browser.development.js +0.25% 139.71 kB 140.06 kB +0.36% 26.02 kB 26.12 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.development.js +0.25% 140.33 kB 140.68 kB +0.35% 26.20 kB 26.29 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.edge.development.js +0.25% 141.78 kB 142.13 kB +0.35% 26.35 kB 26.44 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js +0.25% 141.93 kB 142.28 kB +0.34% 26.41 kB 26.50 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.node.unbundled.development.js +0.24% 142.86 kB 143.21 kB +0.36% 26.46 kB 26.56 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.unbundled.development.js +0.24% 143.03 kB 143.38 kB +0.36% 26.52 kB 26.62 kB
oss-experimental/react-server-dom-turbopack/cjs/react-server-dom-turbopack-server.node.development.js +0.24% 143.97 kB 144.32 kB +0.36% 26.72 kB 26.81 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.development.js +0.24% 144.12 kB 144.47 kB +0.35% 26.78 kB 26.87 kB

Generated by 🚫 dangerJS against b424e2e

@sebmarkbage
Copy link
Collaborator Author

sebmarkbage commented Jul 22, 2024

If we didn't do this but left this up to the consumer, and added environment, one benefit is that they'd have the path of the environments that this passed through. I wonder if that is useful though over just knowing the environment name of the original source. Probably not and if it was maybe environment name should be more unique.

@sebmarkbage sebmarkbage merged commit f83615a into facebook:main Jul 22, 2024
187 checks passed
felixshiftellecon added a commit to felixshiftellecon/react that referenced this pull request Jul 24, 2024
…rialized (facebook#30416)

Stacked on facebook#30410.

If we've parsed another RSC stream on the server from a different RSC
server, while using `findSourceMapURL`, the Flight Client ends up adding
a `rsc://React/` prefix and a numeric suffix to the URL. It's a virtual
file that represents the virtual eval:ed frame in that environment.

If we then see that same stack again, we'd serialize a virtual frame to
another virtual. Meaning `findSourceMapURL` on the client would see the
virtual frame of the intermediate server and it would have to strip it
to figure out what source map to use.

This PR strips it in the Server if we see a virtual frame. At each new
client it always refers to the original stack.

We don't have to do this. We could leave it to each `findSourceMapURL`
implementation and `captureOwnerStack` parser to recursively strip each
layer. It could maybe be useful to have the environment name in the
virtual frame to know which server to look for the source map in.
felixshiftellecon added a commit to felixshiftellecon/react that referenced this pull request Jul 24, 2024
…rialized (facebook#30416)

Stacked on facebook#30410.

If we've parsed another RSC stream on the server from a different RSC
server, while using `findSourceMapURL`, the Flight Client ends up adding
a `rsc://React/` prefix and a numeric suffix to the URL. It's a virtual
file that represents the virtual eval:ed frame in that environment.

If we then see that same stack again, we'd serialize a virtual frame to
another virtual. Meaning `findSourceMapURL` on the client would see the
virtual frame of the intermediate server and it would have to strip it
to figure out what source map to use.

This PR strips it in the Server if we see a virtual frame. At each new
client it always refers to the original stack.

We don't have to do this. We could leave it to each `findSourceMapURL`
implementation and `captureOwnerStack` parser to recursively strip each
layer. It could maybe be useful to have the environment name in the
virtual frame to know which server to look for the source map in.
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