Require.ensure() non-blocking
<p>If we have different bundles created by <em>webpack</em> and we <code>require.ensure</code> something to dynamically <em>transfer+eval</em> it at a later point in time, it happens via <em>jsonPadding</em> and some webpack js magic. If we have</p>

<pre><code>require.ensure([ ], ( require ) =&gt; {
    console.log('before...');
    var data = require( './myModule.js' );
    console.log('after...');
  }, 'myModule')
</code></pre>

<p><code>"after..."</code> will get encountered when that module was entirely transferred and evaluated. If it happens to be that this <em>chunk</em> / <em>module</em> is pretty big, contains images, css and whatnot, the loading will pretty much lock down a browser while the webpack javascript code unpacks the bundle with all its components.</p>

<p><strong>Question</strong>: Is there any way to "hook" into that <code>require</code> magic? For instance, it would be a dream scenario to have callbacks for:</p>

<ul>
<li><em>whole file / chunk was transferred</em></li>
<li><em>image[1] was evaluated</em></li>
<li><em>css[1] was evaluated / style tag was injected</em></li>
<li><em>javascript was evaluated</em></li>
</ul>

<p>and so forth, assuming that our transferred bundle contains a lot of data. In general it just bothers me pretty hard to have a nice option to asynchronously transfer whole bundles dynamically, but still have to load that very bundle in full sync / blocking fashion.</p>