title: React Functional component: calling as function vs. as component
body: <p>Say I have a functional component:</p>
  
  <pre><code>const Foo = (props) =&gt; ( &lt;div&gt;{props.name}&lt;/div&gt; );
  </code></pre>
  
  <p>What is the difference between calling it directly as a function:</p>
  
  <pre><code>const fooParent = () =&gt; (
      &lt;div&gt; {Foo({ name: "foo" })} &lt;/div&gt;
  )
  </code></pre>
  
  <p>versus calling it as a component:</p>
  
  <pre><code>const fooParent = () =&gt; (
      &lt;div&gt; &lt;Foo name="foo"/&gt; &lt;/div&gt;
  )
  </code></pre>
  
  <p>I'm mostly interested in performance implications, how React treats them differently internally, and perhaps how things might be different in React Fiber, where I hear functional components got a performance boost.</p>