Skip to content

Commit

Permalink
[Fizz/Flight] pipeToNodeWritable(..., writable).startWriting() -> ren…
Browse files Browse the repository at this point in the history
…derToPipeableStream(...).pipe(writable) (#22450)

* Rename pipeToNodeWritable to renderToNodePipe

* Add startWriting API to Flight

We don't really need it in this case because there's way less reason to
delay the stream in Flight.

* Pass the destination to startWriting instead of renderToNode

* Rename startWriting to pipe

This mirrors the ReadableStream API in Node

* Error codes

* Rename to renderToPipeableStream

This mimics the renderToReadableStream API for the browser.
  • Loading branch information
sebmarkbage committed Oct 6, 2021
1 parent 6485ef7 commit 579c008
Show file tree
Hide file tree
Showing 11 changed files with 169 additions and 178 deletions.
8 changes: 6 additions & 2 deletions fixtures/flight/server/handler.server.js
@@ -1,6 +1,6 @@
'use strict';

const {pipeToNodeWritable} = require('react-server-dom-webpack/writer');
const {renderToPipeableStream} = require('react-server-dom-webpack/writer');
const {readFile} = require('fs');
const {resolve} = require('path');
const React = require('react');
Expand All @@ -20,7 +20,11 @@ module.exports = function(req, res) {
const App = m.default.default || m.default;
res.setHeader('Access-Control-Allow-Origin', '*');
const moduleMap = JSON.parse(data);
pipeToNodeWritable(React.createElement(App), res, moduleMap);
const {pipe} = renderToPipeableStream(
React.createElement(App),
moduleMap
);
pipe(res);
}
);
});
Expand Down
30 changes: 13 additions & 17 deletions fixtures/ssr/server/render.js
@@ -1,5 +1,5 @@
import React from 'react';
import {pipeToNodeWritable} from 'react-dom/server';
import {renderToPipeableStream} from 'react-dom/server';

import App from '../src/components/App';

Expand All @@ -20,22 +20,18 @@ export default function render(url, res) {
console.error('Fatal', error);
});
let didError = false;
const {startWriting, abort} = pipeToNodeWritable(
<App assets={assets} />,
res,
{
onCompleteShell() {
// If something errored before we started streaming, we set the error code appropriately.
res.statusCode = didError ? 500 : 200;
res.setHeader('Content-type', 'text/html');
startWriting();
},
onError(x) {
didError = true;
console.error(x);
},
}
);
const {pipe, abort} = renderToPipeableStream(<App assets={assets} />, {
onCompleteShell() {
// If something errored before we started streaming, we set the error code appropriately.
res.statusCode = didError ? 500 : 200;
res.setHeader('Content-type', 'text/html');
pipe(res);
},
onError(x) {
didError = true;
console.error(x);
},
});
// Abandon and switch to client rendering after 5 seconds.
// Try lowering this to see the client recover.
setTimeout(abort, 5000);
Expand Down
7 changes: 3 additions & 4 deletions fixtures/ssr2/server/render.js
Expand Up @@ -8,7 +8,7 @@

import * as React from 'react';
// import {renderToString} from 'react-dom/server';
import {pipeToNodeWritable} from 'react-dom/server';
import {renderToPipeableStream} from 'react-dom/server';
import App from '../src/App';
import {DataProvider} from '../src/data';
import {API_DELAY, ABORT_DELAY} from './delays';
Expand Down Expand Up @@ -37,17 +37,16 @@ module.exports = function render(url, res) {
});
let didError = false;
const data = createServerData();
const {startWriting, abort} = pipeToNodeWritable(
const {pipe, abort} = renderToPipeableStream(
<DataProvider data={data}>
<App assets={assets} />
</DataProvider>,
res,
{
onCompleteShell() {
// If something errored before we started streaming, we set the error code appropriately.
res.statusCode = didError ? 500 : 200;
res.setHeader('Content-type', 'text/html');
startWriting();
pipe(res);
},
onError(x) {
didError = true;
Expand Down
2 changes: 1 addition & 1 deletion packages/react-dom/npm/server.node.js
Expand Up @@ -14,4 +14,4 @@ exports.renderToString = l.renderToString;
exports.renderToStaticMarkup = l.renderToStaticMarkup;
exports.renderToNodeStream = l.renderToNodeStream;
exports.renderToStaticNodeStream = l.renderToStaticNodeStream;
exports.pipeToNodeWritable = s.pipeToNodeWritable;
exports.renderToPipeableStream = s.renderToPipeableStream;
4 changes: 2 additions & 2 deletions packages/react-dom/server.node.js
Expand Up @@ -36,8 +36,8 @@ export function renderToStaticNodeStream() {
);
}

export function pipeToNodeWritable() {
return require('./src/server/ReactDOMFizzServerNode').pipeToNodeWritable.apply(
export function renderToPipeableStream() {
return require('./src/server/ReactDOMFizzServerNode').renderToPipeableStream.apply(
this,
arguments,
);
Expand Down

0 comments on commit 579c008

Please sign in to comment.