Use react-dom/server.browser in Node.js (#33950)

Instead of branching rendering based on Node.js and browser/web runtimes, we should just use the web version for now, which can run as-is on versions >=16.5.0 of Node.js, polyfilling `ReadableStream` on older versions when necessary.

There are a few potential downsides to this, as React is less able to optimize flushing and execution. We can revisit that in the future though if desired.

packages/next/build/webpack-config.ts

@@ -610,14 +610,6 @@ export default async function getBaseWebpackConfig(
           }
         : {}),
 
-      ...(webServerRuntime
-        ? {
-            'react-dom/server': dev
-              ? 'react-dom/cjs/react-dom-server.browser.development'
-              : 'react-dom/cjs/react-dom-server.browser.production.min',
-          }
-        : {}),
-
       setimmediate: 'next/dist/compiled/setimmediate',
     },
     ...(targetWeb

packages/next/server/node-polyfill-readable-stream.js

@@ -0,0 +1,6 @@
+import { ReadableStream } from './web/sandbox/readable-stream'
+
+// Polyfill ReadableStream in the Node.js environment
+if (!global.ReadableStream) {
+  global.ReadableStream = ReadableStream
+}

packages/next/server/render-result.ts

@@ -1,15 +1,14 @@
 import type { ServerResponse } from 'http'
-import type { Writable } from 'stream'
 
-export type NodeWritablePiper = (
-  res: Writable,
+export type ResultPiper = (
+  push: (chunks: Uint8Array[]) => void,
   next: (err?: Error) => void
 ) => void
 
 export default class RenderResult {
-  _result: string | NodeWritablePiper
+  _result: string | ResultPiper
 
-  constructor(response: string | NodeWritablePiper) {
+  constructor(response: string | ResultPiper) {
     this._result = response
   }
 
@@ -29,8 +28,35 @@ export default class RenderResult {
       )
     }
     const response = this._result
+    const flush =
+      typeof (res as any).flush === 'function'
+        ? () => (res as any).flush()
+        : () => {}
+
     return new Promise((resolve, reject) => {
-      response(res, (err) => (err ? reject(err) : resolve()))
+      let fatalError = false
+      response(
+        (chunks) => {
+          // The state of the stream is non-deterministic after
+          // writing, so any error becomes fatal.
+          fatalError = true
+          res.cork()
+          chunks.forEach((chunk) => res.write(chunk))
+          res.uncork()
+          flush()
+        },
+        (err) => {
+          if (err) {
+            if (fatalError) {
+              res.destroy(err)
+            }
+            reject(err)
+          } else {
+            res.end()
+            resolve()
+          }
+        }
+      )
     })
   }