JobbyM's Blog

react ReactDOMServer

此文章是翻译ReactDOMServer这篇React(版本v15.4.0)官方文档。

ReactDOMServer

如果你用script 标签来使用React,这些顶级APIs 将会在全局ReactDOMServer 上有用。如果你在npm 中使用ES6,你可以写import ReactDOMServer from 'react-dom/server'。如果你在npm 中使用ES5,你可以写var ReactDOMServer = require('react-dom/server')

Overview

ReactDOMServer 允许你在服务端渲染你的component。

Reference

renderToString()

1
ReactDOMServer.renderToString(element)

渲染一个React element 去初始化HTML。这仅被应用在服务器端。React 将返回一个HTML 字符串。你应该在服务器端使用这个方法生成HTML并且将标记放在更快的页面加载的初始请求,允许搜索引擎抓取你的网页来达到SEO(搜索引擎优化)目的。

如果你在一个已经在服务器端进行渲染的标记上的节点进行调用ReactDOM.render(),React 将阻止它并且只是绑定事件句柄,允许你有一个首次加载的性能。

renderToStaticMarkup()

1
ReactDOMServer.renderToStaticMarkup(element)

类似renderToString,除了它保护创建额外的DOM 属性例如data-reactid,React 在内部使用。这是有用的如果你想要使用React 作为一个简单的静态页面生成器,因为剥离额外的属性可以节省大量的字节。

参考文档

  1. ReactDOMServer