title: Does React skip components within render with falsy ternary values?
body: <p>This question might be a bit odd but bear with me.</p>
  
  <p>I have a component called <code>HomeComponent</code> which is the first component to get rendered when the app starts. Within this component, I have other smaller components that get rendered depending on the <code>state</code> of <code>HomeComponent</code>. </p>
  
  <p>I know it is not the most beautiful code but here is a snippet of <code>HomeComponent render()</code>.</p>
  
  <pre><code>    {
        this.state.isInPinlockMode
        ?
        &lt;PinlockComponent
          onPinCorrect={this.onHidePinlock}
        /&gt;
        :
  
        this.state.isInPastYearsMode
        ?
        &lt;PastYearsComponent
          onClosePastYears={this.onClosePastYears}
        /&gt;
        :
  
        this.state.isInDashboardMode
        ?
        &lt;DashboardComponent
          onCloseDashboardMode={this.onCloseDashboardMode}
        /&gt;
        :
  
        this.state.isInJournalMode
        ?
        &lt;JournalComponent
          onCloseJournalMode={this.onCloseJournalMode}
        /&gt;
        :
        ...another component
  </code></pre>
  
  <p>I am using react native RAM modules and inline-requires. This means that when HomeComponent first renders all the above-listed components have not yet been required.
  They only get required when a user presses a certain button within <code>HomeComponent</code>.</p>
  
  <p>However, I am unsure if these components are still slowing down the <code>render()</code> of HomeComponent just by being within its <code>render()</code> method.</p>
  
  <p>Are they slowing it down?
  Is HomeComponent <strong>skipping</strong> these components?</p>