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

Add Next.js runtime support to ReactFizzServer #22350

Closed
wants to merge 13 commits into from
Closed

Add Next.js runtime support to ReactFizzServer #22350

wants to merge 13 commits into from

Conversation

devknoll
Copy link
Contributor

@devknoll devknoll commented Sep 17, 2021

Summary

Support for a Next.js runtime in ReactFizzServer that doesn't rely on Node or Browser APIs.

How did you test this change?

Implemented in Next.js (https://github.com/azukaru/next.js/pull/695/files) and ran against CI.

@sizebot
Copy link

sizebot commented Sep 17, 2021

Comparing: 56efc65...a290681

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 = 129.68 kB 129.68 kB = 41.46 kB 41.46 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js = 134.66 kB 134.66 kB = 42.94 kB 42.94 kB
facebook-www/ReactDOM-prod.classic.js = 424.11 kB 424.11 kB = 78.18 kB 78.18 kB
facebook-www/ReactDOM-prod.modern.js = 412.66 kB 412.66 kB = 76.43 kB 76.43 kB
facebook-www/ReactDOMForked-prod.classic.js = 424.11 kB 424.11 kB = 78.18 kB 78.18 kB
oss-experimental/react-dom/cjs/react-dom-server-next.development.js +∞% 0.00 kB 225.50 kB +∞% 0.00 kB 54.97 kB
oss-experimental/react-dom/cjs/react-dom-server-next.production.min.js +∞% 0.00 kB 32.84 kB +∞% 0.00 kB 11.23 kB
oss-stable-semver/react-dom/cjs/react-dom-server-next.development.js +∞% 0.00 kB 224.97 kB +∞% 0.00 kB 54.82 kB
oss-stable-semver/react-dom/cjs/react-dom-server-next.production.min.js +∞% 0.00 kB 32.71 kB +∞% 0.00 kB 11.18 kB
oss-stable/react-dom/cjs/react-dom-server-next.development.js +∞% 0.00 kB 224.97 kB +∞% 0.00 kB 54.82 kB
oss-stable/react-dom/cjs/react-dom-server-next.production.min.js +∞% 0.00 kB 32.71 kB +∞% 0.00 kB 11.18 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-dom/cjs/react-dom-server-next.development.js +∞% 0.00 kB 225.50 kB +∞% 0.00 kB 54.97 kB
oss-experimental/react-dom/cjs/react-dom-server-next.production.min.js +∞% 0.00 kB 32.84 kB +∞% 0.00 kB 11.23 kB
oss-stable-semver/react-dom/cjs/react-dom-server-next.development.js +∞% 0.00 kB 224.97 kB +∞% 0.00 kB 54.82 kB
oss-stable-semver/react-dom/cjs/react-dom-server-next.production.min.js +∞% 0.00 kB 32.71 kB +∞% 0.00 kB 11.18 kB
oss-stable/react-dom/cjs/react-dom-server-next.development.js +∞% 0.00 kB 224.97 kB +∞% 0.00 kB 54.82 kB
oss-stable/react-dom/cjs/react-dom-server-next.production.min.js +∞% 0.00 kB 32.71 kB +∞% 0.00 kB 11.18 kB

Generated by 🚫 dangerJS against a290681

@wardpeet
Copy link

I'm curious why Node APIs or Browser APIs are problematic here? (I can think of some reasons why the Browser API are problematic) For Node, can't we leverage the drain event + stream.write to check if the buffer is full?

If not, perhaps it's better for React to create its own Stream Interface that people can hook their implementation in. An out of the box solution for streams can be provided. It would mean that no framework-specific code needs to be in React.

@devknoll
Copy link
Contributor Author

@wardpeet

I'm curious why Node APIs or Browser APIs are problematic here? (I can think of some reasons why the Browser API are problematic) For Node, can't we leverage the drain event + stream.write to check if the buffer is full?

The problem is server runtimes that aren't Node (think Deno or Cloudflare Workers).

If not, perhaps it's better for React to create its own Stream Interface that people can hook their implementation in. An out of the box solution for streams can be provided. It would mean that no framework-specific code needs to be in React.

I'm not opposed to this, but would want alignment from the React folks first.

@sebmarkbage
Copy link
Collaborator

sebmarkbage commented Sep 20, 2021

If not, perhaps it's better for React to create its own Stream Interface that people can hook their implementation in.

We're not really in the space of defining general purpose streaming APIs. Seems better that hosts that know what the best lowest level protocol they can expose and that they're willing to support for multiple purposes. If there are attempts for standardizing those, then having those discussions seems better with the people involved in those hosts.

We are however in the space of supporting multiple different platforms so it's pretty trivial to support multiple if they're big enough.

startWriting() {
startFlowing(request);
},
stopWriting() {
Copy link
Collaborator

Choose a reason for hiding this comment

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

I was planning on renaming startWriting so naming this as a pair wouldn't necessarily make sense.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Not quite sure what you mean. Would a single function to toggle on/off be better? Or otherwise could you elaborate?

@@ -1899,7 +1899,7 @@ function flushCompletedQueues(request: Request): void {
}

export function startWork(request: Request): void {
scheduleWork(() => performWork(request));
scheduleWork(request.destination, () => performWork(request));
Copy link
Collaborator

@sebmarkbage sebmarkbage Sep 20, 2021

Choose a reason for hiding this comment

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

While it might make sense to want to schedule based on the destination, the assumption of this API implies a lot more of a global scheduler like postTask. I worry that this might take us down the wrong assumptions.

For sync I/O, it'll also be required that it's an instance (or at least thread) per request so in that world it doesn't matter anyway.

What is the intention/purpose of this?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Eh, just some flexibility. I can revert it and make it use a global instead, that wouldn't be a problem.

@devknoll devknoll changed the title [Draft] Add Next.js runtime support Add Next.js runtime support to ReactFizzServer Sep 20, 2021
@devknoll devknoll marked this pull request as ready for review September 20, 2021 23:52
@gaearon
Copy link
Collaborator

gaearon commented Dec 8, 2021

ping @sebmarkbage, what’s needed to unblock this?

This pull request was closed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

7 participants