zoukankan      html  css  js  c++  java
  • react中关于render渲染次数的性能优化

    在普通组件里面可以使用shouldComponentUpdate钩子函数提升react性能。 (nextProps,nextState)
    在内部可以判断组件外部接受的最新属性与之前的属性是否一致,从而约束render刷新的时机。
    只要结果返回true,render就会立马执行渲染更新,返回false就代表render不会执行。

    可以使用PureComponent来优化性能。内部机制是通过浅比较去实现的。
    PureComponent代表纯组件,纯组件内部是不能再去复写shouldComponentUpdate这个钩子函数了
    内部进行浅比较(进行值比较或者内部地址的比较),进行性能的优化
    注意:如果是值比较的话,外部传入的属性与内部的属性不一样的话,才会进行render更新操作
    如果是引用地址比较的话,例如数组,之前的属性数组的地址与更改后的新的数组的地址一致,那么就不会进行render的更新操作

    对于无状态组件的话,使用 React.memo(组件) 来进行性能提升

  • 相关阅读:
    pycharm过期后,修改hosts文件?
    三种格式化方式
    virtualenv安装及使用
    二分查找以及单例模式
    目录总览
    SQLAlchemy
    Redis
    linux 安装虚拟机
    shell基本命令
    Linux 命令大全
  • 原文地址:https://www.cnblogs.com/Mine-/p/14098606.html
Copyright © 2011-2022 走看看