1

需要在渲染之前获取所有数据
由于需要渲染一个完整的跟组件，
所以必须等所有的数据加载完毕，才可以开始渲染

所以可拆包技术 大的bundjs拆开
单独下载并执行

总结

等待上一步执行完，才能进行下一步

服务端获取所有的数据----》服务端渲染—〉
客户端家在代码进行注水----》页面可交互

分别执行2次ReactDOM.renderToString方法
通过拆分React DOM Root的方式
完成服务端渲染的拆分
从而规避了数据获取时拖延服务端渲染的问题

直到所有组件完成注水，才可以被交互

吸水时执行js逻辑以及绑定事件的回调的过程
react要求前端生产的组件树和服务端产出的组件树保持一至，
会造成前端渲染内容覆盖服务端渲染内容

React18 SSR

suspense
支持服务端渲染
支持服务端流失传输HTML
支持客户端选择性吸水

suspense

可以做到服务端暂停SSR工作，并在确定渲染内容后，继续返回

将渲染进行拆分，再结合选择性注水的能力，
加快页面可交互时间

解决了上面3个问题

1.需要在渲染前获取所有数据

可以优先返回静态内容，并在获取数据后继续返回余下内容

2.需要全部内容加载后才能注水

可以将代码拆分与服务端渲染结合使用
HRML在完成局部渲染后，可以优先对局部注水

3.直到所有组件注水完成后才可以交互

优先选择用户正在交互的组件注水