1. 减少子组件渲染

  当 父组件 state 内的某个值(eg:value) 不变时 子组件菜 render

  shouldComponentUpdate(nextProps, nextState){

    // 当父组件传递到子组件的值不同时 子组件才渲染

    return nextProps.value !== this.props.value;

  }

2. 函数作用域绑定 卸载 constructor 内

  // 只用绑定一次作用域 降低性能消耗 可以 避免无谓的渲染

  constructor(props){

    super(props);

    this.clickEvent = this.clickEvent.bind(this);

  }

3. setState 是异步操作 写成异步匿名函数 可以把多次 数据修改渲染 结合成一次来做

  this.setState((prevState)=>({

    array1 : [...prevState, str1,str2,str3],

    string : 'this is string'

  }));

4. 虚拟DOM

5. 同层比对

react 16 性能提升 总结的更多相关文章

  1. React 16 加载性能优化指南

    关于 React 应用加载的优化,其实网上类似的文章已经有太多太多了,随便一搜就是一堆,已经成为了一个老生常谈的问题. 但随着 React 16 和 Webpack 4.0 的发布,很多过去的优化手段 ...

  2. Facebook发布React 16 专利条款改为MIT开源协议

    9 月 26 日,用于构建 UI 的 JavaScript 库 React 16 的最新版本上线. Facebook 最终在现有的两种 React 版本中选择了出现 bug 概率最少的一款.这次版本更 ...

  3. 在MongoDB中创建一个索引而性能提升1000倍的小例子

    在https://www.cnblogs.com/xuliuzai/p/9965229.html的博文中我们介绍了MongoDB的常见索引的创建语法.部分同学还想看看MongoDB的威力到底有多大,所 ...

  4. oracle网络服务之beq协议和SDU优化(性能提升可达30%)

    oracle网络服务之beq协议和SDU优化(性能提升可达30%) 12.3.1  BEQ协议 如果Oracle数据库服务端和客户端在同一台机器上,可以使用BEQ连接,BEQ连接采用进程间直接通信,不 ...

  5. VNF网络性能提升解决方案及实践

    VNF网络性能提升解决方案及实践 2016年7月 作者:    王智民 贡献者:     创建时间:    2016-7-20 稳定程度:    初稿 修改历史 版本 日期 修订人 说明 1.0 20 ...

  6. 盘点 React 16.0 ~ 16.5 主要更新及其应用

    目录 0. 生命周期函数的更新 1. 全新的 Content API 2. React Strict Mode 3. Portal 4. Refs 5. Fragment 6. 其他 7. 总结 生命 ...

  7. asp.net 性能提升

    原文链接:http://www.oschina.net/translate/8-ways-improve-asp-net-web-api-performance ASP.NET Web API 是非常 ...

  8. oracle 11g亿级复杂SQL优化一例(数量级性能提升)

    自从16年之后,因为工作原因,项目中就没有再使用oracle了,最近最近支持一个项目,又要开始负责这块事情了.最近在跑性能测试,配置全部调好之后,不少sql还存在性能低下的问题,主要涉及执行计划的不合 ...

  9. 初探性能优化——2个月到4小时的性能提升(copy)推荐阅读

    一直不知道性能优化都要做些什么,从哪方面思考,直到最近接手了一个公司的小项目,可谓麻雀虽小五脏俱全.让我这个编程小白学到了很多性能优化的知识,或者说一些思考方式.真的感受到任何一点效率的损失放大一定倍 ...

随机推荐

  1. 让SVG以组件的方式引入吧!

    安装 npm i -D vue-svg-loader or yarn add -D vue-svg-loader webpack 配置 module.exports = { module: { rul ...

  2. 1 初识JVM

  3. 关于list

    //问题一: List<string> list = new List<string>(); list = null; //这样写可以使用,但是当list值为null时会报未将 ...

  4. (九)微信小程序---for指令

    对于数据是列表 wxml <view wx:for="{{dataList}}">{{index}}-{{item}}</view> 我们可以看到上面的代码 ...

  5. java 循环节长度

    循环节长度 两个整数做除法,有时会产生循环小数,其循环部分称为:循环节. 比如,11/13=6=>0.846153846153- 其循环节为[846153] 共有6位. 下面的方法,可以求出循环 ...

  6. 又一个无效的列类型错误Error setting null for parameter #7 with JdbcType NULL . Try setting a different JdbcType for this parameter or a different jdbcTypeForNull configuration property. Cause: java.sql.SQLExcept

    在更新数据时候出现的错误 更新代码如下: <update id="modify" parameterType="Standard"> update ...

  7. MongoDB 副本集搭建

    搭建mongodb副本集 [root@ mongodb]# cd /u02 [root@ u02]# mkdir -p mongodb/data_2777 [root@ u02]# mkdir -p ...

  8. Redis 详解 (四) redis的底层数据结构

    目录 1.演示数据类型的实现 2.简单动态字符串 3.链表 4.字典 5.跳跃表 6.整数集合 7.压缩列表 8.总结 上一篇博客我们介绍了 redis的五大数据类型详细用法,但是在 Redis 中, ...

  9. 四十一、在SAP中添加多条件选择框

    一.代码如下: 二.其中我们的文本替换内容如下 三.需要注意的是波浪线的用法,以及区域的添加方法.运行程序,显示如下 四.不勾选时,查询出来是去掉国际的 五.勾选之后,查询的是全部的 六.显示如下 七 ...

  10. 2019-9-16 java上课知识整理总结(动手动脑,课后实验)

    java上课知识整理总结(动手动脑,课后实验) 一,课堂测试 1,题目:课堂测试:像二柱子那样,花二十分钟写一个能自动生成30道小学四则运算题目的 “软件” 要求:(1)题目避免重复: (2)可定制( ...