Use react dom server node api to detect react root is enabled (#36749)

x-ref: #36552 (comment)
x-ref: preactjs/next-plugin-preact#59

`preact/compat` doesn't have `/server.browser` exports, to make it work with latest of next.js: 

* use `react-dom/server` to detect if it could opt-in streaming rendering by checking react 18 `renderToPipeableStream` API in short time fix. In long term `preact/compat`should support `/server.browser` that same with react 17.
* Also filed a PR to `next-plugin-preact` to skip chunk-prepending to pages in edge compiler

Author: huozhi

packages/next/bin/next.ts

@@ -43,8 +43,7 @@ const args = arg(
 )
 
 // Detect if react-dom is enabled streaming rendering mode
-const shouldUseReactRoot = !!require('react-dom/server.browser')
-  .renderToReadableStream
+const shouldUseReactRoot = !!require('react-dom/server').renderToPipeableStream
 
 // Version is inlined into the file using taskr build pipeline
 if (args['--version']) {

packages/next/server/next.ts

@@ -185,8 +185,8 @@ function createServer(options: NextServerOptions): NextServer {
 
   // Make sure env of custom server is overridden.
   // Use dynamic require to make sure it's executed in it's own context.
-  const ReactDOMServer = require('react-dom/server.browser')
-  const shouldUseReactRoot = !!ReactDOMServer.renderToReadableStream
+  const ReactDOMServer = require('react-dom/server')
+  const shouldUseReactRoot = !!ReactDOMServer.renderToPipeableStream
   if (shouldUseReactRoot) {
     ;(process.env as any).__NEXT_REACT_ROOT = 'true'
   }

packages/next/server/view-render.tsx

@@ -17,12 +17,14 @@ import {
   continueFromInitialStream,
 } from './node-web-streams-helper'
 import { FlushEffectsContext } from '../shared/lib/flush-effects'
-// @ts-ignore react-dom/client exists when using React 18
-import ReactDOMServer from 'react-dom/server.browser'
 import { isDynamicRoute } from '../shared/lib/router/utils'
 import { tryGetPreviewData } from './api-utils/node'
 import DefaultRootLayout from '../lib/views-layout'
 
+const ReactDOMServer = process.env.__NEXT_REACT_ROOT
+  ? require('react-dom/server.browser')
+  : require('react-dom/server')
+
 export type RenderOptsPartial = {
   err?: Error | null
   dev?: boolean