clean-react-component.js

class Main extends React.Component {
  // ...
  
  render() {
    // Because we've named the prop `this._handleClick`, we're now passing a FUNCTION REFERENCE and
    // no longer creating a new function on every render cycle. The function reference will not change throughout
    // the lifecycle of `Main`, therefore it will never cause `Button` to re-render.
    return (
      <div>
        <p>This button has been clicked {count} times</p>
        <Button onClick={this._handleClicked} />
      </div>
    );
  }

  _handleClicked = () => {
    // ...
  };
}