title: Do nested Suspense components cause a sequential or a parallel load?
body: <p>I understand that Suspense components are the React-ian approach to <a href="https://reactjs.org/docs/code-splitting.html" rel="noreferrer">code splitting</a>, which makes webpages load faster. Now, say you have a component hierarchy like this:</p>
  
  <pre class="lang-js prettyprint-override"><code>&lt;App&gt;
    &lt;Suspense fallback={&lt;FirstLoader/&gt;}&gt;
      &lt;OuterWrapper&gt;
        &lt;Suspense fallback={&lt;SecondLoader/&gt;}&gt;
          &lt;InnerWrapper&gt;
            {content}
          &lt;/InnerWrapper&gt;
        &lt;/Suspense&gt;
      &lt;/OuterWrapper&gt;
    &lt;/Suspense&gt;
  &lt;/App&gt;
  </code></pre>
  
  <p>Assume first that only <code>InnerWrapper</code> is lazy-loaded, and in the second case they are both lazy loaded.</p>
  
  <p>Does React defer the loading of <code>InnerWrapper</code> after <code>OuterWrapper</code> is loaded, or are they both loaded simultaneously? Specifically, whether the rendering of the 2nd Suspense's fallback is deferred after the first component is loaded. </p>