前端猛男的博客基础知识 - 性能提升
性能提升
- shouldComponentUpdate
控制组件 自身 或 子组件 是否需要更新，尤其是在子组件多的情况下，需要进行优化
- PureComponent
React提供了这个方法, 他会自动帮我们检测,新老属性|状态 ,做对比来决定
shouldcomponentUpdata,来返回true 跟 false ,从而决定要不要呼叫render
import React, { PureComponent, Component } from "react";
import ReactDom from 'react-dom';
class App extends PureComponent {
state = { title: 1 };
componentDidUpdate() {
console.log("componentDidMount");//多次点击不会执行
}
render() {
return (
<div>
<button
onClick={() => {
this.setState({
title: "前端猛男",
});
}}
>
点击
</button>
{this.state.title}
</div>
);
}
}
ReactDom.render(<App/>,document.getElementById('root');)