switch flowing

Author: sebmarkbage

packages/react-server-dom-webpack/src/ReactFlightDOMServerBrowser.js

@@ -26,7 +26,7 @@ function renderToReadableStream(
   options?: Options,
 ): ReadableStream {
   let request;
-  return new ReadableStream({
+  const stream = new ReadableStream({
     start(controller) {
       request = createRequest(
         model,
@@ -37,10 +37,17 @@ function renderToReadableStream(
       startWork(request);
     },
     pull(controller) {
-      startFlowing(request);
+      // Pull is called immediately even if the stream is not passed to anything.
+      // That's buffering too early. We want to start buffering once the stream
+      // is actually used by something so we can give it the best result possible
+      // at that point.
+      if (stream.locked) {
+        startFlowing(request);
+      }
     },
     cancel(reason) {},
   });
+  return stream;
 }
 
 export {renderToReadableStream};

packages/react-server-dom-webpack/src/ReactFlightDOMServerNode.js

@@ -37,8 +37,9 @@ function pipeToNodeWritable(
     webpackMap,
     options ? options.onError : undefined,
   );
-  destination.on('drain', createDrainHandler(destination, request));
   startWork(request);
+  startFlowing(request);
+  destination.on('drain', createDrainHandler(destination, request));
 }
 
 export {pipeToNodeWritable};