1)React 的事件綁定,在服務端渲染時,并不會以 這種內聯事件形態出現。所以,ReactDOMServer 渲染的內容在「結構-樣式-行為」鐵三角關系里,缺失了「行為」
2)在 React v15 版本里,ReactDOM.render 方法可以根據 data-react-checksum 的標記,復用 ReactDOMServer 的渲染結果,不重復渲染,而是根據 data-reactid 屬性,找到需要綁定的事件元素,進行事件綁定的處理。補完「結構-樣式-行為」。
3)在 React v16 版本里,ReactDOMServer 渲染的內容不再有 data-react 的屬性,而是盡可能復用 SSR 的 HTML 結構。
這就帶來了一個問題,ReactDOM.render 不再能夠簡單地用 data-react-checksum 的存在性來判斷是否應該嘗試復用,如果每次 ReactDOM.render 都要盡可能嘗試復用,性能和語義都會出現問題。所以, ReactDOM 提供了一個新的 API, ReactDOM.hydrate() 。

4)在 React v17 版本里,ReactDOM.render 則直接不再具有復用 SSR 內容的功能。見:[https://github.com/facebook/react/blob/master/src/renderers/dom/shared/\_\_tests\_\_/ReactRenderDocument-test.js#L32-L34](https://link.zhihu.com/?target=https%3A//github.com/facebook/react/blob/master/src/renderers/dom/shared/__tests__/ReactRenderDocument-test.js%23L32-L34)
**結論: hydrate 描述的是 ReactDOM 復用 ReactDOMServer 服務端渲染的內容時盡可能保留結構,并補充事件綁定等 Client 特有內容的過程。**
- 說明
- react源碼
- 問答
- 慕課網視頻
- 第二章:基礎知識
- 001.ReactElement
- 002.react-component
- 003.ref
- 004.forwardRef
- 005.context
- 006.concurrentMode
- 007.supense和lazy
- 008.hooks
- 009.children
- 010.memo
- 011.others
- 第三章:react的更新
- 001.react-dom-render
- 第四章:Fiber Scheduler
- 第五章:各類組件的Update
- 第六章:完成節點任務
- 第七章:commitRoot
- 第八章:功能詳解:基礎
- 第九章:suspense and priority
- 第十章:功能詳解:Hooks
- 001.基礎知識
- 002.hook
- 003.RootFiber
- 004. hydrate
- react
- 高階組件
- react基礎
- Github面試題目