Skip to content

Conversation

sebmarkbage
Copy link
Collaborator

@sebmarkbage sebmarkbage commented Apr 18, 2023

This is just a small refactor of the Flight Reply implementation that upcoming features will depend on.

Before this PR, we used to enumerate over FormData object as if it was a stream but it's not really a stream. This is kind of unnecessary since we could just look up entries in it directly. It turns out we're going to need to keep track of seen entries in general and since FormData is a suitable data structure for that, we can just use it as a backing store to save seen entries. Since we already have one in the case of the FormData API we can just use the existing one.

However, we also support streams. In this case we create a new one and then save entries into it as we see them.

Then we only conditionally create Chunk representations lazily as we parse them out of the FormData. At this point we could remove the entry from the FormData to free the memory, since we've "consumed" it. This would mutate the passed value. I stopped short of that for now though.

Additionally, this supports a "prefix" to be added to all our entries in the FormData payload. That way it can co-exist with other user space entries. We'll rely on this internally. This isn't currently exposed as an option but we easily could.

@sebmarkbage sebmarkbage requested review from gnoff and acdlite April 18, 2023 17:46
@facebook-github-bot facebook-github-bot added CLA Signed React Core Team Opened by a member of the React Core Team labels Apr 18, 2023
@react-sizebot
Copy link

react-sizebot commented Apr 18, 2023

Comparing: b600620...525bbf1

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 = 164.42 kB 164.42 kB = 51.69 kB 51.69 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js = 166.86 kB 166.86 kB = 52.34 kB 52.34 kB
facebook-www/ReactDOM-prod.classic.js = 564.45 kB 564.45 kB = 99.40 kB 99.40 kB
facebook-www/ReactDOM-prod.modern.js = 548.24 kB 548.24 kB = 96.71 kB 96.71 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-webpack/cjs/react-server-dom-webpack-server.node.unbundled.development.js +0.55% 84.27 kB 84.73 kB +1.09% 20.24 kB 20.46 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.unbundled.development.js +0.55% 84.27 kB 84.73 kB +1.09% 20.24 kB 20.46 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.unbundled.development.js +0.55% 84.27 kB 84.73 kB +1.09% 20.24 kB 20.46 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.development.js +0.53% 86.59 kB 87.05 kB +1.02% 20.92 kB 21.14 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.development.js +0.53% 86.59 kB 87.05 kB +1.02% 20.92 kB 21.14 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.development.js +0.53% 86.59 kB 87.05 kB +1.02% 20.92 kB 21.14 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.unbundled.production.min.js +0.53% 20.35 kB 20.45 kB +1.25% 7.27 kB 7.36 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.unbundled.production.min.js +0.53% 20.35 kB 20.45 kB +1.25% 7.27 kB 7.36 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.unbundled.production.min.js +0.53% 20.35 kB 20.45 kB +1.25% 7.27 kB 7.36 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.production.min.js +0.51% 20.91 kB 21.02 kB +1.22% 7.45 kB 7.54 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.production.min.js +0.51% 20.91 kB 21.02 kB +1.22% 7.45 kB 7.54 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.node.production.min.js +0.51% 20.91 kB 21.02 kB +1.22% 7.45 kB 7.54 kB
oss-experimental/react-server-dom-webpack/umd/react-server-dom-webpack-server.browser.production.min.js = 19.96 kB 19.72 kB = 7.18 kB 7.15 kB
oss-stable-semver/react-server-dom-webpack/umd/react-server-dom-webpack-server.browser.production.min.js = 19.96 kB 19.72 kB = 7.18 kB 7.15 kB
oss-stable/react-server-dom-webpack/umd/react-server-dom-webpack-server.browser.production.min.js = 19.96 kB 19.72 kB = 7.18 kB 7.15 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.production.min.js = 20.04 kB 19.80 kB = 7.16 kB 7.12 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.production.min.js = 20.04 kB 19.80 kB = 7.16 kB 7.12 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.production.min.js = 20.04 kB 19.80 kB = 7.16 kB 7.12 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.production.min.js = 19.75 kB 19.51 kB = 7.07 kB 7.02 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.production.min.js = 19.75 kB 19.51 kB = 7.07 kB 7.02 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.production.min.js = 19.75 kB 19.51 kB = 7.07 kB 7.02 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js = 84.09 kB 82.97 kB = 20.55 kB 20.45 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js = 84.09 kB 82.97 kB = 20.55 kB 20.45 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js = 84.09 kB 82.97 kB = 20.55 kB 20.45 kB
oss-experimental/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.development.js = 83.60 kB 82.48 kB = 20.41 kB 20.31 kB
oss-stable-semver/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.development.js = 83.60 kB 82.48 kB = 20.41 kB 20.31 kB
oss-stable/react-server-dom-webpack/cjs/react-server-dom-webpack-server.browser.development.js = 83.60 kB 82.48 kB = 20.41 kB 20.31 kB
oss-experimental/react-server-dom-webpack/umd/react-server-dom-webpack-server.browser.development.js = 88.39 kB 87.18 kB = 20.69 kB 20.58 kB
oss-stable-semver/react-server-dom-webpack/umd/react-server-dom-webpack-server.browser.development.js = 88.39 kB 87.18 kB = 20.69 kB 20.58 kB
oss-stable/react-server-dom-webpack/umd/react-server-dom-webpack-server.browser.development.js = 88.39 kB 87.18 kB = 20.69 kB 20.58 kB

Generated by 🚫 dangerJS against 525bbf1

sebmarkbage added a commit that referenced this pull request Apr 18, 2023
Builds on top of #26661

This lets you pass FormData objects through the Flight Reply
serialization. It does that by prefixing each entry with the ID of the
reference and then the decoding side creates a new FormData object
containing only those fields (without the prefix).

Ideally this should be more generic. E.g. you should be able to pass
Blobs, Streams and Typed Arrays by reference inside plain objects too.
You should also be able to send Blobs and FormData in the regular Flight
serialization too so that they can go both directions. They should be
symmetrical. We'll get around to adding more of those features in the
Flight protocol as we go.

---------

Co-authored-by: Sophie Alpert <[email protected]>
@sebmarkbage
Copy link
Collaborator Author

Landed as part of #26663

kassens pushed a commit that referenced this pull request Apr 21, 2023
Builds on top of #26661

This lets you pass FormData objects through the Flight Reply
serialization. It does that by prefixing each entry with the ID of the
reference and then the decoding side creates a new FormData object
containing only those fields (without the prefix).

Ideally this should be more generic. E.g. you should be able to pass
Blobs, Streams and Typed Arrays by reference inside plain objects too.
You should also be able to send Blobs and FormData in the regular Flight
serialization too so that they can go both directions. They should be
symmetrical. We'll get around to adding more of those features in the
Flight protocol as we go.

---------

Co-authored-by: Sophie Alpert <[email protected]>
EdisonVan pushed a commit to EdisonVan/react that referenced this pull request Apr 15, 2024
Builds on top of facebook#26661

This lets you pass FormData objects through the Flight Reply
serialization. It does that by prefixing each entry with the ID of the
reference and then the decoding side creates a new FormData object
containing only those fields (without the prefix).

Ideally this should be more generic. E.g. you should be able to pass
Blobs, Streams and Typed Arrays by reference inside plain objects too.
You should also be able to send Blobs and FormData in the regular Flight
serialization too so that they can go both directions. They should be
symmetrical. We'll get around to adding more of those features in the
Flight protocol as we go.

---------

Co-authored-by: Sophie Alpert <[email protected]>
Akshato07 pushed a commit to Akshato07/-Luffy that referenced this pull request Feb 20, 2025
Builds on top of facebook/react#26661

This lets you pass FormData objects through the Flight Reply
serialization. It does that by prefixing each entry with the ID of the
reference and then the decoding side creates a new FormData object
containing only those fields (without the prefix).

Ideally this should be more generic. E.g. you should be able to pass
Blobs, Streams and Typed Arrays by reference inside plain objects too.
You should also be able to send Blobs and FormData in the regular Flight
serialization too so that they can go both directions. They should be
symmetrical. We'll get around to adding more of those features in the
Flight protocol as we go.

---------

Co-authored-by: Sophie Alpert <[email protected]>

DiffTrain build for commit facebook/react@d8089f2.
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.

3 participants