title: Download javascript dynamically and execute it later
body: <p>I am trying to optimize page loading time. And the only thing left is optimizing asset loading times. I have few assets and a library script.
  Some of the assets are dependent to this library.</p>
  
  <p><strong>Vendor Scripts</strong></p>
  
  <ul>
  <li>library.min.js</li>
  <li>vendor.min.js</li>
  </ul>
  
  <p><strong>Bundle Scripts</strong></p>
  
  <ul>
  <li>page.bundle.js (dependent to library.min.js)</li>
  <li>play.min.js (dependent to vendor.min.js)</li>
  <li>gtm.min.js (dependent to library.min.js)</li>
  </ul>
  
  <p>What I want to achieve is start loading all of these assets when page is fully loaded. As I am rendering everything at serverside, it is not a problem for me to delay user interactions. I just need to download <code>library.min.js</code> then <code>page.bundle.js</code> in the exact order but <strong>when I need to</strong>.</p>
  
  <p>I tried few things, but I just couldn't start downloading and execute it in right order. Currently I am planning to use xhr and <code>eval</code> content when I need it. But I am not sure if this is the right way. There are more questions to ask when using this method. Caching etc.</p>
  
  <p>Can someone give me an idea how can I split download and execution time of dynamically loaded javascript files?</p>