title: Arrow functions inside map in render. React
body: <p>I'd like to know if there  is any performance difference between passing an arrow function to a map function inside render, and passing a reference to that arrow function, like so:</p>
  
  <pre><code>render {
     const { users } = this.props;
  
     //Arrow function passed to map,  in render. 
     const userList= 
      users.map((user) =&gt;
       &lt;User
        name={ user.name }
       /&gt;);
  
      return(
       &lt;div&gt;
        {userList}
       &lt;/div&gt;
      );
   }
  </code></pre>
  
  <p>vs</p>
  
  <pre><code>makeUser = (user) =&gt; &lt;User name={ this.props.user.name } /&gt;
  
  render {
     const { users } = this.props;
  
     //Passing the arrow function reference
     const userList = users.map(this.makeUser);
  
      return(
       &lt;div&gt;
        {userList}
       &lt;/div&gt;
      );
   }
  </code></pre>
  
  <p>Isn't the first one creating and allocating space in memory, for the arrow function, each time render is called?</p>
  
  <p>Thanks</p>