Skip to content

Commit dee0304

Browse files
sebmarkbagesebmarkbage
authored
[Flight] Basic Streaming Suspense Support (#17285)
* Return whether to keep flowing in Host config * Emit basic chunk based streaming in the Flight server When something suspends a new chunk is created. * Add reentrancy check The WHATWG API is designed to be pulled recursively. We should refactor to favor that approach. * Basic streaming Suspense support on the client * Add basic suspense in example * Add comment describing the protocol that the server generates
1 parent f50f39b commit dee0304

File tree

11 files changed

+530
-103
lines changed

11 files changed

+530
-103
lines changed

‎fixtures/flight-browser/index.html‎

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,8 +37,26 @@ <h1>Flight Example</h1>
3737
);
3838
}
3939

40+
let resolved = false;
41+
let promise = new Promise(resolve => {
42+
setTimeout(() => {
43+
resolved = true;
44+
resolve();
45+
}, 100);
46+
});
47+
function read() {
48+
if (!resolved) {
49+
throw promise;
50+
}
51+
}
52+
53+
function Title() {
54+
read();
55+
return 'Title';
56+
}
57+
4058
let model = {
41-
title: 'Title',
59+
title: <Title />,
4260
content: {
4361
__html: <HTML />,
4462
}
@@ -69,7 +87,9 @@ <h1>Flight Example</h1>
6987
function Shell({ data }) {
7088
let model = data.model;
7189
return <div>
72-
<h1>{model.title}</h1>
90+
<Suspense fallback="...">
91+
<h1>{model.title}</h1>
92+
</Suspense>
7393
<div dangerouslySetInnerHTML={model.content} />
7494
</div>;
7595
}

‎packages/react-dom/src/client/flight/ReactFlightDOMClient.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ function startReadingFromStream(response, stream: ReadableStream): void {
2626
return;
2727
}
2828
let buffer: Uint8Array = (value: any);
29-
processBinaryChunk(response, buffer, 0);
29+
processBinaryChunk(response, buffer);
3030
return reader.read().then(progress, error);
3131
}
3232
function error(e) {

‎packages/react-dom/src/server/ReactDOMFizzServerBrowser.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ function renderToReadableStream(children: ReactNodeList): ReadableStream {
2323
startWork(request);
2424
},
2525
pull(controller) {
26-
startFlowing(request, controller.desiredSize);
26+
startFlowing(request);
2727
},
2828
cancel(reason) {},
2929
});

‎packages/react-dom/src/server/ReactDOMFizzServerNode.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import type {Writable} from 'stream';
1313
import {createRequest, startWork, startFlowing} from 'react-server/inline.dom';
1414

1515
function createDrainHandler(destination, request) {
16-
return () => startFlowing(request, 0);
16+
return () => startFlowing(request);
1717
}
1818

1919
function pipeToNodeWritable(

‎packages/react-dom/src/server/flight/ReactFlightDOMServerBrowser.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ function renderToReadableStream(model: ReactModel): ReadableStream {
2323
startWork(request);
2424
},
2525
pull(controller) {
26-
startFlowing(request, controller.desiredSize);
26+
startFlowing(request);
2727
},
2828
cancel(reason) {},
2929
});

‎packages/react-dom/src/server/flight/ReactFlightDOMServerNode.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import {
1717
} from 'react-server/flight.inline.dom';
1818

1919
function createDrainHandler(destination, request) {
20-
return () => startFlowing(request, 0);
20+
return () => startFlowing(request);
2121
}
2222

2323
function pipeToNodeWritable(model: ReactModel, destination: Writable): void {

0 commit comments

Comments
 (0)