react同构
传统的reactSPA应用存在以下问题 ：
- 首屏加载速度慢
-
不利于SEO
5922673890f5e347c729b732866de9f.png
因为百度的搜索引擎爬虫只认识Html上的文本内容，不认识 js上的内容。而SPA应用服务器返回的是一个空的html,里面只包含id = 'root'的div标签。所以百度的蜘蛛爬虫抓取不到页面的SEO信息。
-
客户端渲染原理：
e09cb47fedfffa3a1c15e79bbf1cbfe.png
-
服务端渲染原理：
eb388ca8bfdc17b690ecd350369360a.png
react服务端渲染建立在react虚拟DOM的基础上
renderToString这个方法，react里的事件不会被渲染出来，只能渲染出组件的基本内容。服务端先把页面渲染出后，让相同的代码在浏览器端像传统的react项目一样再次运行一下
所以同构，说白了就是相同的代码，在浏览器端执行一次，在服务器上执行一次。
9ece49ca6817d4baa806cdb7ff0e60c.png
服务端渲染只在页面第一次加载时做相应的请求。请求html和JS，路由跳转的时候，是客户端Js控制的页面跳转。
同构是只有首次进入的页面是服务端渲染，其他页面还是react机制。
ssr路由：客户端：BrowserRouter 服务端: staticRouter
异步数据服务端渲染时，ComponentDidMount在服务器端是不执行的,所以要解决如何在服务端执行ComponentDidMount的问题。=>loadData方法及路由重构
loadData方法负责在服务端渲染之前，把这个路由需要的数据提前加载好
