shouldComponentUpdate
询问组件是否需要更新的一个钩子函数，判断数据是否需要重新渲染，返回一个布尔值。默认的返回值是true，需要重新render()。若如果返回值是false则不触发渲染,利用这个生命周期函数可以强制关闭不需要更新的子组件来提升渲染性能。
这个方法用来判断是否需要调用 render 方法重新描绘 dom。
因为 dom 的描绘非常消耗性能，如果我们能在 shouldComponentUpdate 方法中能够写出更优化的 dom diff 算法，可以极大的提高性能。

shouldComponentUpdate 是做什么的，（react 性能优化是哪个周期函数？）的更多相关文章

  1. react性能优化

    前面的话 本文将详细介绍react性能优化 避免重复渲染 当一个组件的props或者state改变时,React通过比较新返回的元素和之前渲染的元素来决定是否有必要更新实际的DOM.当他们不相等时,R ...

  2. 关于React性能优化

    这几天陆陆续续看了一些关于React性能优化的博客,大部分提到的都是React 15.3新加入的PureComponent ,通过使用这个类来减少React的重复渲染,从而提升页面的性能.使用过Rea ...

  3. React性能优化之PureComponent 和 memo使用分析

    前言 关于react性能优化,在react 16这个版本,官方推出fiber,在框架层面优化了react性能上面的问题.由于这个太过于庞大,我们今天围绕子自组件更新策略,从两个及其微小的方面来谈rea ...

  4. React性能优化记录（不定期更新）

    React性能优化记录(不定期更新) 1. 使用PureComponent代替Component 在新建组件的时候需要继承Component会用到以下代码 import React,{Componen ...

  5. React 性能优化 All In One

    React 性能优化 All In One Use CSS Variables instead of React Context https://epicreact.dev/css-variables ...

  6. React 性能优化总结

    初学者对React可能满怀期待,觉得React可能完爆其它一切框架,甚至不切实际地认为React可能连原生的渲染都能完爆--对框架的狂热确实会出现这样的不切实际的期待.让我们来看看React的官方是怎 ...

  7. React性能优化总结（转）

    原文链接: https://segmentfault.com/a/1190000007811296?utm_source=tuicool&utm_medium=referral 初学者对Rea ...

  8. react性能优化要点

    1.减少render方法的调用 1.1继承React.PureComponent(会自动在内部使用shouldComponentUpdate方法对state或props进行浅比较.)或在继承自Reac ...

  9. React性能优化总结

    本文主要对在React应用中可以采用的一些性能优化方式做一下总结整理 前言 目的 目前在工作中,大量的项目都是使用react来进行开展的,了解掌握下react的性能优化对项目的体验和可维护性都有很大的 ...

随机推荐

  1. 随GCTY

    1.用常数1来取代运行时间中所有加法常数. 2.修改后的运行次数函数中,只保留最高阶项 3.如果最高阶项存在且不是1,则去除与这个项相乘的常数. 如果sum = (1+n)*n/2这条语句再执行10遍 ...

  2. shell 脚本使用记录

    2019-03-26 需求是:因为遇到一些测试偶发性的出现,比如执行了20次会出一次错误,然后就顺手写了一个小脚本,用来判断执行了 n 次,是否出现错误.根据正则来匹配出substring value ...

  3. fdisk

    fdisk管理分区 参数                 作用                                   m                                 ...

  4. 解决ant Design dva ajax跨越请求 （status=0）

    今天实现了antd作为前端展现,python flask作为后端的数据填充,完全两个独立的服务:过程中遇到ajax跨越请求问题,导致status一直等于0,原来是这么写的: xmlhttp.open( ...

  5. webpack 入门踩坑

    参考来源:知乎张轩 安装 先装好node和npm,因为webpack是一个基于node的项目.然后 npm install -g webpack 全局安装 还可以在当前项目里面也安装一个webpack ...

  6. android 职业 转行

    不知道多少人和我一样.学安卓安卓工作.成了一件很烦躁的事情.甚至迷茫.    起初学安卓,是因为安卓流行,所以有兴趣,想要学.那个时候想做一个应用,想对安卓手机有个了解,比如获取手机短信.没有太在意工 ...

  7. js点击回到顶部2

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>点 ...

  8. [HNOI2017]礼物

    Description: 给定两个有n个数的序列,你可以将其中一个进行旋转(想象是在一个环上),或者对序列的每个数加上一个非负整数C 求操作后 \(\sum{(a_i-b_i)^2}\)的最小值 De ...

  9. 说一下Servlet里面得request和response

    当一个servlet被调用的时候,我们一般继承带协议的httpServlet,大方向上是下图这样 在这里面request和response起了什么作用呢? 来细究一下. request:1.封装了客户 ...

  10. BZOJ3655 : 神经错乱数

    注意到前3个操作都不会影响每列的情况,而第4个操作必然会将行列交换,故只要每行的和相同即可满足条件. 考虑数位DP,设$f[i][j][k][t]$表示考虑最高的$i$位,第一行的和是$j$,当前行的 ...