ReactDOMServer
参考链接：https://zh-hans.reactjs.org/docs/react-dom-server.html
ReactDOMServer 对象允许你将组件渲染成静态标记。通常，它被使用在 Node 服务端上
// ES modules
import * as ReactDOMServer from 'react-dom/server';
// CommonJS
var ReactDOMServer = require('react-dom/server');
React SSR 介绍
什么是客户端渲染
CSR：Client Side Rendering
服务器端仅返回JSON数据，Data和Html在客户端进行拼接。
什么是服务端渲染
SSR：Server Side Rendering
服务器端返回HTML，Data和Html在服务器端进行拼接。
客户端渲染存在的问题：
- 首屏等待时间长，用户体验差
- 页面结构为空，不利于SSO
客户端渲染首屏时间长的原因如下：
首先浏览器要求服务器端请求一个空的HTML，然后再去请求json数据，然后再进行HTML与json数据的组合，然后再渲染页面。而服务器渲染只需要浏览器去服务端请求一次带有内容的HTML，即可有完整的页面(虽然可能没有交互，因为还得请求js)
React SSR 同构
同构指的是代码复用，即实现客户端和服务器端最大程度的代码复用。
服务端渲染demo
1. 创建Node服务
2. 实现 React SSR
3. webpack 打包配置
问题：node环境不支持esmodule模块，不支持jsx语法
4. 客户端React添加事件
在服务端的React代码里添加事件是不生效的，因此需要在客户端进行二次渲染。
实现思路：在客户端对组件进行二次渲染，为组件元素添加事件。
总结：
SSR：
- CSR相较SSR首屏时间长的原因。
- 需要借助react-dom/server提供的renderToString()方法将React组件转换成字符串，方便服务端返回。
- 需要进行代码同构，同构指的是代码复用，即实现客户端和服务器端最大程度的代码复用。
- 服务端渲染对于事件不生效，需要借用ReactDom提供的hydrate在客户端进行二次渲染，hydrate方法在实现渲染的时候，会复用原本已经存在的DOM节点，减少重新生成节点以及删除原本DOM节点的开销。
