It is better bind methods in the constructor of a component or in the render method?

Viewed 3059

Which is better (more performant), if one it is:

A:

class Man extends React.Component {
  constructor(props) {
    super(props)
    this.talk = this.talk.bind(this)
    this.state = {}
  }

  talk() { .. }

  render () {
    return <div onClick={this.talk}>talk!</div>
  }
}

B:

class Man extends React.Component {
  constructor(props) {
    super(props)
    this.state = {}
  }

  talk() { .. }

  render () {
    return <div onClick={this.talk.bind(this)}>talk!</div>
  }
}

C:

class Man extends React.Component {
  constructor(props) {
    super(props)
    this.state = {}
  }

  talk() { .. }

  render () {
    return <div onClick={() => this.talk()}>talk!</div>
  }
}

I think that calling the bind method directly in the render method could be negligible, but after all the render method is called ton of times. I want to understand if making a change in a big codebase is it worth it or not.

4 Answers
Related