ReactDOMServer
ReactDOMServer 对象允许你将组件渲染成静态标记。通常，它被使用在 Node 服务端上：
// ES modules
import * as ReactDOMServer from 'react-dom/server';
// CommonJS
var ReactDOMServer = require('react-dom/server');概览
These methods are only available in the environments with Node.js Streams:
这些方法只在支持 Web Streams 的环境中可用（这包含浏览器，Deno 和一些现代边缘 runtime）：
以下方法可以在不支持 Steam 的环境中使用：
参考
renderToPipeableStream()
Try the new React documentation for
renderToPipeableStream.The new docs will soon replace this site, which will be archived. Provide feedback.
ReactDOMServer.renderToPipeableStream(element, options)将一个 React 元素渲染为初始 HTML。返回一个带有 pipe(res) 方法的流，用于管道输出。abort() 用于中止请求。完美支持了 suspense 和 HTML 流，“延迟” 的内容块会通过内联的 <script> 标签嵌入。了解更多
如果你在一个已经被服务端渲染标记的节点上调用 ReactDOM.hydrateRoot()，React 会保留它，只附加事件处理程序，让你有一个非常高性能的首次加载体验。
let didError = false;
const stream = renderToPipeableStream(
<App />,
{
onShellReady() {
// The content above all Suspense boundaries is ready.
// If something errored before we started streaming, we set the error code appropriately.
res.statusCode = didError ? 500 : 200;
res.setHeader('Content-type', 'text/html');
stream.pipe(res);
},
onShellError(error) {
// Something errored before we could complete the shell so we emit an alternative shell.
res.statusCode = 500;
res.send(
'<!doctype html><p>Loading...</p><script src="clientrender.js"></script>'
);
},
onAllReady() {
// If you don't want streaming, use this instead of onShellReady.
// This will fire after the entire page content is ready.
// You can use this for crawlers or static generation.
// res.statusCode = didError ? 500 : 200;
// res.setHeader('Content-type', 'text/html');
// stream.pipe(res);
},
onError(err) {
didError = true;
console.error(err);
},
}
);具体参见 完整的选项列表.
注意：
这是一个针对 Node.js 的 API。只在支持 Web Streams 的环境下可用，如 Deno 以及现代边缘 runtimes，应使用
renderToReadableStream代替。
renderToReadableStream()
Try the new React documentation for
renderToReadableStream.The new docs will soon replace this site, which will be archived. Provide feedback.
ReactDOMServer.renderToReadableStream(element, options);将一个 React 元素通过流的形式注入初始的 HTML 中。返回值为 Promise, resolve 一个 可读 Stream。完美支持了 suspense 和 HTML 流。了解更多
如果你在一个已经被服务端渲染标记的节点上调用 ReactDOM.hydrateRoot()，React 会保留它，只为其附加事件处理程序。让你拥有一个非常良好的首次加载体验。
let controller = new AbortController();
let didError = false;
try {
let stream = await renderToReadableStream(
<html>
<body>Success</body>
</html>,
{
signal: controller.signal,
onError(error) {
didError = true;
console.error(error);
}
}
);
// This is to wait for all Suspense boundaries to be ready. You can uncomment
// this line if you want to buffer the entire HTML instead of streaming it.
// You can use this for crawlers or static generation:
// await stream.allReady;
return new Response(stream, {
status: didError ? 500 : 200,
headers: {'Content-Type': 'text/html'},
});
} catch (error) {
return new Response(
'<!doctype html><p>Loading...</p><script src="clientrender.js"></script>',
{
status: 500,
headers: {'Content-Type': 'text/html'},
}
);
}具体参见 完整的选项列表。
注意：
该 API 依赖 Web Streams。对于，请使用
renderToPipeableStream代替。
renderToNodeStream() (Deprecated)
Try the new React documentation for
renderToNodeStream.The new docs will soon replace this site, which will be archived. Provide feedback.
ReactDOMServer.renderToNodeStream(element)将一个 React 元素渲染成其初始 HTML。返回一个可输出 HTML 字符串的 Node.js 可读流。通过可读流输出的 HTML 完全等同于 ReactDOMServer.renderToString 返回的 HTML。你可以使用本方法在服务器上生成 HTML，并在初始请求时将标记下发，以加快页面加载速度，并允许搜索引擎抓取你的页面以达到 SEO 优化的目的。
如果你在已有服务端渲染标记的节点上调用 ReactDOM.hydrateRoot() 方法，React 将会保留该节点且只进行事件处理绑定，从而让你有一个非常高性能的首次加载体验。
注意:
这个 API 仅允许在服务端使用。不允许在浏览器使用。
通过本方法返回的流会返回一个由 utf-8 编码的字节流。如果你需要另一种编码的流，请查看像 iconv-lite 这样的项目，它为转换文本提供了转换流。
renderToStaticNodeStream()
Try the new React documentation for
renderToStaticNodeStream.The new docs will soon replace this site, which will be archived. Provide feedback.
ReactDOMServer.renderToStaticNodeStream(element)此方法与 renderToNodeStream 相似，但此方法不会在 React 内部创建的额外 DOM 属性，例如 data-reactroot。如果你希望把 React 当作静态页面生成器来使用，此方法会非常有用，因为去除额外的属性可以节省一些字节。
通过可读流输出的 HTML，完全等同于 ReactDOMServer.renderToStaticMarkup 返回的 HTML。
如果你计划在前端使用 React 以使得标记可交互，请不要使用此方法。你可以在服务端上使用 renderToNodeStream 或在前端上使用 ReactDOM.hydrateRoot() 来代替此方法。
注意:
此 API 仅限于服务端使用，在浏览器中是不可用的。
通过本方法返回的流会返回一个由 utf-8 编码的字节流。如果你需要另一种编码的流，请查看像 iconv-lite 这样的项目，它为转换文本提供了转换流。
renderToString()
Try the new React documentation for
renderToString.The new docs will soon replace this site, which will be archived. Provide feedback.
ReactDOMServer.renderToString(element)将一个 React 元素渲染成其初始的 HTML。React 将返回一个 HTML 字符串。你可以使用这种方法在服务器上生产 HTML，并在初始请求中发送标记。以加快页面加载速度，并允许搜索引擎以 SEO 为目的抓取你的页面。
如果你在一个已被服务端渲染标记的节点上调用 ReactDOM.hydrateRoot()，React 会保留它，只附加事件处理程序，让你有一个非常良好的首次加载体验。
注意：
此 API 对 Suspense 支持有限，并且不支持流。
在服务端，建议使用
renderToPipeableStream(Node.js) 或者renderToReadableStream(for Web Streams) 代替。
renderToStaticMarkup()
Try the new React documentation for
renderToStaticMarkup.The new docs will soon replace this site, which will be archived. Provide feedback.
ReactDOMServer.renderToStaticMarkup(element)与 renderToString 相似，只是该方法不会创建 React 内部使用的额外 DOM 属性，如 data-reactroot。如果你只想把 React 作为简单的静态页面生成器使用，此方法会非常实用。因为剥离多余的属性可以节省一些字节占用。
如果你打算在客户端使用 React 进行交互标记，那请不要使用这个方法。作为替代，你可以在服务器使用 renderToString，同时在客户端使用 ReactDOM.hydrateRoot()。