12. How to Profile Component Perfomance / 如何提升效率
最后更新于:2022-04-01 05:02:23
当然不是咖啡!
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-11-20_564e9933620f7.gif)
##12.1 [react profile](https://facebook.github.io/react/docs/perf.html)
## 12.2 PureRenderMixin
当你的 props 和 state 都是 immutable 的时候…
~~~
var PureRenderMixin = require('react-addons-pure-render-mixin');
React.createClass({
mixins: [PureRenderMixin],
render: function() {
return <div className={this.props.className}>foo</div>;
}
});
~~~
## 12.3 [shouldComponentUpdate](https://facebook.github.io/react/docs/advanced-performance.html#shouldcomponentupdate-in-action)
可以通过这个方法对于 component 到底什么情况下应该重新 render 调优
> 所有图片来源于 giphy.com, copyright @[Futurama](http://www.cc.com/shows/futurama)
> Author: Jichao Ouyang
> Modified: 2015-11-16 Mon 00:39
> Generated by: [Emacs](http://www.gnu.org/software/emacs/) 24.5.1 ([Org](http://orgmode.org/) mode 8.3.2)
> with _(:з」∠)_ by [OrgPress](https://github.com/jcouyang/orgpress)