前后端同构就是指前后端共用一套 JS 代码，首次渲染时通过 Node.js 直接返回 HTML 给浏览器。

React 实现同构可以使用 ReactDomServer.renderToString() (opens new window)。

Vue 实现同构可以使用 VueServerRenderer.renderToString() (opens new window)。

React/Vue 同构的最大难题其实是数据部分，尤其是在使用了一些状态管理库的时候，比如 redux 或者 vuex。因此，业界也有一些比较成熟的方案用来解决这个难题，帮助更快实现服务端渲染，比如 Next.js (opens new window)。

同构的关键就是要注重代码职责的分离，环境代码和业务数据代码分开。

服务端渲染和同构渲染的本质区别就是是否能在前端和服务端服用组件和代码。

• 服务端模板渲染通常和前端代码是两套代码，不会复用代码逻辑；

• 同构渲染则会复用大部分业务代码，组件和方法既可以用作服务端渲染，也可以在前端渲染。