react router dom文档
react hydrate原理
    Hydrate是React的一个特性，它可以在服务端和客户端之间同步数据，使得页面在客户端被渲染的时候能够更快地加载数据和交互元素。Hydrate的本质是在客户端使用已有的HTML和JavaScript代码结构去创建React组件树，这样使得组件可以更快地被渲染和显示。
    1. 服务端渲染：在服务端使用derToString（）方法将React组件渲染为HTML字符串，并将HTML字符串注入到HTML页面中。
    2. 客户端加载页面：在客户端加载页面时，浏览器获取HTML页面并解析出DOM节点和JavaScript代码。
    3. JavaScript代码加载：浏览器请求JavaScript代码，并在加载完成后执行。
    4. 客户端渲染：在客户端执行JavaScript代码时，React会使用ReactDOM.hydrate（）方法去挂载已有的DOM节点，重新构建虚拟DOM，和服务端渲染时返回的React组件进行对比和匹配并尽可能地使用现有的DOM节点去复用已有的组件。
    整个过程可以分为以下几个步骤：
    1. 首先，React从服务端获得已经渲染好的组件列表，并转成JSON格式，在客户端执行的时候被挂载到window对象上。
    2. 当客户端加载页面，JavaScript代码开始执行时，浏览器会加载ReactDOM.hydrate方法。
    3. 当浏览器加载完所有的JavaScript代码后，React开启了一个异步任务，去检查客户端渲染时已有的DOM节点是否和服务端渲染的React组件相匹配。
    4. 如果发现服务端渲染的React组件与已有的DOM节点不匹配，则React就会通过已有的DOM节点构建新的虚拟DOM，然后算出最少的DOM更新操作来使得整个页面显示和服务端渲染的效果一致。