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) |
渲染一个R 大专栏 react ReactDOMServereact element 去初始化HTML。这仅被应用在服务器端。React 将返回一个HTML 字符串。你应该在服务器端使用这个方法生成HTML并且将标记放在更快的页面加载的初始请求,允许搜索引擎抓取你的网页来达到SEO(搜索引擎优化)目的。
如果你在一个已经在服务器端进行渲染的标记上的节点进行调用ReactDOM.render(),React 将阻止它并且只是绑定事件句柄,允许你有一个首次加载的性能。
renderToStaticMarkup()
1 |
ReactDOMServer.renderToStaticMarkup(element) |
类似renderToString,除了它保护创建额外的DOM 属性例如data-reactid,React 在内部使用。这是有用的如果你想要使用React 作为一个简单的静态页面生成器,因为剥离额外的属性可以节省大量的字节。
参考文档
react ReactDOMServer的更多相关文章
- react项目开发入门
v16.2.0 在html头部引入react相关js文件 <!-- react核心库--><script src="../static/react/react.produc ...
- React.render和reactDom.render的区别
刚开始学习react.js.发现网上的资料,有些是写着react.render,有些写着reactDom.render.觉得很奇怪就查阅了一下资料.解释如下: 这个是react最新版api,也就是0. ...
- React入门--------顶层API
React.createClass 参数:config(object) 创建一个ReactClass(组件类),参数是一个对象且必须带有render属性方法,该方法必须返回一个封闭的容器(容器内可以由 ...
- React同构直出原理浅析
通常,当客户端请求一个包含React组件页面的时候,服务端首先响应输出这个页面,客户端和服务端有了第一次交互.然后,如果加载组件的过程需要向服务端发出Ajax请求等,客户端和服务端又进行了一次交互,这 ...
- ReactDom.render和React.render的区别
这个是react最新版api,也就是0.14版本做出的改变.主要是为了使React能在更多的不同环境下更快.更容易构建.于是把react分成了react和react-dom两个部分.这样就为web版的 ...
- React Redux Sever Rendering实战
# React Redux Sever Rendering(Isomorphic JavaScript)  react客户端渲染的一大痛点就是首屏渲染速度慢问题,因为react是一个单页面应用,大多数的资源需要在首次渲染前就加载 ...
随机推荐
- 纯手撸web框架
纯手撸web框架 一.Web应用的组成 接下来我们学习的目的是为了开发一个Web应用程序,而Web应用程序是基于B/S架构的,其中B指的是浏览器,负责向S端发送请求信息,而S端会根据接收到的请求信息返 ...
- UVa202
刚刚开始写的适合感觉是转换成字符然后开始遍历一遍,后面发现各种不行,就回去看了看题目,重新构思,写了好久还是WA,最后只能看下大神的操作(我太菜了). 先简单梳理下题目意思:首先给出两个数,然后这两个 ...
- tomcat设置远程监听端口(linux&windows)
1.Linxu系统: apach/bin/startup.sh开始处中增加如下内容: declare -x CATALINA_OPTS="-server -Xdebug -Xnoagent ...
- 18)C++对C的增强
在C++中所有的变量都必须有类型,但是在C语言中没有这个要求,C语言中的默认类型在C++中不合法, #include<stdio.h> f() { ; } int main() { int ...
- gitlab安装教程
gitlab安装教程 安装教程 官网安装方法 https://about.gitlab.com/downloads/#centos7 1.准备 sudo yum install curl po ...
- 一篇文章带你了解axios网络交互-Vue
来源:滁州SEO 1 **什么是axios呢?**了解,并去使用它,对于axios发送请求的两种方式有何了解,以及涉及axios跨域问题如何解决. 对于axios网络交互,去使用axios的同时,首先 ...
- JavaScript 的 URL 对象是什么?
如果我们自己编写从URL中分析和提取元素的代码,那么有可能会比较痛苦和麻烦.程序员作为这个社会中最“懒”的群体之一,无休止的重复造轮子必然是令人难以容忍的,所以大多数浏览器的标准库中都已经内置了URL ...
- 关于 Xpath 定位
关于 Xpath 定位 问: // 和 / 的区别 表达式 描述 nodename 选取此节点的所有子节点. / 从根节点选取. // 从匹配选择的当前节点选择文档中的节点,而不考虑它们的位置. . ...
- Regex: positive lookahead 先行断言____ 后行断言(lookbehind)
先行断言: /a(?=b)/ ,positive lookahead,a的后方必须是b才行 /a(?!b)/ ,negative lookahead,a的后方必须不是b才能匹配 如下图示: 来 ...
- VirtualBox虚拟机安装
目录 安装前准备 1.开始安装,安装很简单,直接上图 2.设置全局路径,这里主要是方便以后创建虚拟机的时候不用每次都去选择存放位置,默认是存放到C盘 安装前准备 系统:Windows 10 专业版 软 ...