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.

Sign up for GitHub

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] Refactor the Render Loop to Behave More Like Fizz #28065

Merged
merged 7 commits into from
Jan 25, 2024
Merged

[Flight] Refactor the Render Loop to Behave More Like Fizz #28065

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
a03905f
attemptResolveElement -> renderElement
sebmarkbage Jan 9, 2024
7ed9706
Move toJSON closure to one per task so that we can pass the task to it
sebmarkbage Jan 23, 2024
15f377f
Switch to recursive renderModel approach
sebmarkbage Jan 23, 2024
9e50bc8
Retry a task using the recursive loop
sebmarkbage Jan 24, 2024
eabf7e4
We need to catch in renderModel after all
sebmarkbage Jan 24, 2024
f3e8681
Tail recursively render the result of server components
sebmarkbage Jan 24, 2024
c289c7e
Stash the active context on the task
sebmarkbage Jan 24, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 14 additions & 0 deletions packages/react-server-dom-webpack/src/__tests__/ReactFlightDOMEdge-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -242,6 +242,20 @@ describe('ReactFlightDOMEdge', () => {
expect(result).toEqual(resolvedChildren);
});

it('should execute repeated server components in a compact form', async () => {
async function ServerComponent({recurse}) {
if (recurse > 0) {
return <ServerComponent recurse={recurse - 1} />;
}
return <div>Fin</div>;
}
const stream = ReactServerDOMServer.renderToReadableStream(
<ServerComponent recurse={20} />,
);
const serializedContent = await readResult(stream);
expect(serializedContent.length).toBeLessThan(150);
});

// @gate enableBinaryFlight
it('should be able to serialize any kind of typed array', async () => {
const buffer = new Uint8Array([
Expand Down
6 changes: 5 additions & 1 deletion packages/react-server/src/ReactFizzServer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2201,8 +2201,12 @@ function renderNodeDestructive(
task.node = node;
task.childIndex = childIndex;

if (node === null) {
return;
}

// Handle object types
if (typeof node === 'object' && node !== null) {
if (typeof node === 'object') {
switch ((node: any).$$typeof) {
case REACT_ELEMENT_TYPE: {
const element: any = node;
Expand Down
Loading