React官方文档： profiler的使用

class MyComponent extends React.Component{
  constructor(props){
    super(props);
    this.myClick=this.myClick.bind(this);
    this.state={val: 0};
  }
  myClick(){
    this.setState({val: this.state.val+1});
  }

  render(){
    return (
      <div>
        <input type="text" value={this.state.val}/>
        <button onClick={this.myClick}>click me</button>
      </div>

    );
  }
}

class MyProfiler extends React.Component{
  constructor(props){
    super(props);
    this.onRenderCallback=this.onRenderCallback.bind(this);
  }
  onRenderCallback(
    id, // 发生提交的 Profiler 树的 “id”
    phase, // "mount" （如果组件树刚加载） 或者 "update" （如果它重渲染了）之一
    actualDuration, // 本次更新 committed 花费的渲染时间
    baseDuration, // 估计不使用 memoization 的情况下渲染整棵子树需要的时间
    startTime, // 本次更新中 React 开始渲染的时间
    commitTime, // 本次更新中 React committed 的时间
    interactions // 属于本次更新的 interactions 的集合
  ) {
    console.log(id);
    console.log(startTime);
    console.log(actualDuration);
  }

  render(){
    return (

      <Profiler id="testProfiler" onRender={this.onRenderCallback}>
        <MyComponent/>
      </Profiler>

    );
  }
}