React-服务器端渲染

想让搜索引擎抓取到你的站点，服务端渲染这一步不可或缺，服务端渲染还可以提升站点的性能，因为在加载javaScript脚本的同时，浏览器就可以进行页面渲染。

React的虚拟DOM是其可被用于服务端渲染的关键。首先每个ReactComponent 在虚拟DOM中完成渲染，然后React通过虚拟DOM来更新浏览器DOM中产生变化的那一部分，虚拟DOM作为内存中的DOM表现，为React在Node.js这类非浏览器环境下的吮吸给你提供了可能，React可以从虚拟DoM中生成一个字符串。而不是跟新真正的DOM，这使得我们可以在客户端和服务端使用同一个React Component。

 

React 提供了两个可用于服务端渲染组件的函数：React.renderToString 和React.render-ToStaticMarkup。 在设计用于服务端渲染的ReactComponent时需要有预见性，考虑以下方面。

选取最优的渲染函数。

如何支持组件的异步状态。

如何将应用的初始化状态传递到客户端。

哪些生命周期函数可以用于服务端的渲染。

如何为应用提供同构路由支持。

单例、实例以及上下文的用法。

 

 

一、渲染函数

在服务端渲染React Component时，无法使用标准的React.render方法，因为服务端不存在DOM。React提供了两个渲染的函数，它们支持标准的React Component生命周期的一个子集。因而能够实现服务端渲染。

 

React.renderToString

React.renderToString是两个服务端渲染函数中的一个，也是开发主要使用的一个函数，和React.render不同，该函数去掉了用于表示渲染位置的参数。取而代之，该函数只返回一个字符串，这是一个快速的同步（阻塞式）函数，非常快。

var MyComponent = React.createClass({

render:fucniton(){

return <div> Hello World!</div>;

}