什么是服务端渲染?
简单理解可以是:前后端不分离,
优点:页面性能好,有利于seo,
缺点:前后端不分离,数据维护难度大
什么是前端渲染?
前端渲染就是利用ajax去拿取后端数据,前端页面结构脱离服务器,不需要服务器返回HTML,css,js等。
优点:结构清晰,各司其职
缺点,:页面加载速度依赖于JS的加载速度(与服务端渲染对比)
node同构直出渲染方案:
大名鼎鼎的Node,也是JS。当前后端都使用js写,就可以实现数据,组件,还有一些方法前后端公用,天下和平,歌舞升平。
如何实现前后端内容共享?
数据共享:对于前后端相同的虚拟dom,服务端使用renderToNodeStream ,将结果以流的形式返回,这样就不用等到html都渲染出来才能给客户端显示结果,。同时,在浏览器端,使用 hydrate 把虚拟 dom 渲染为真实的 DOM 元素。若浏览器端对比服务端渲染的组件数,若发生不一致的情况时,不再直接丢掉全部的内容,而是进行局部的渲染。因此在使用服务端的渲染过程中,要保证前端后组件数据的一致性。这里将服务端请求的数据,插入到 js 的全局变量中,随着 html 一起渲染到浏览器端(脱水);这是在浏览器端,就可以拿到脱水的数据来初始化组件,添加交互等等(注水)。