As far as the image goes, I wanted to do the same, i.e. dynamic loading of dependencies.
I managed to do that, I set up my webpack config, added babel-runtime transformer, babel-preset-stage-0 in order to use async/await. Everything worked.
BUT
Once I set up my webpack config and its CommonsChunkPlugin with an option { async: true }, my production bundle was loaded up with +800KB of code (currently our production bundle css+js+img = 2mb, by then, it was around 3mb :/ )
The only thing that had anything to do with loading up my bundle size was this option async: true. This filesize increase is without changes in the code, just the webpack config.
Anybody experienced the same?
My webpack prod. config https://gist.github.com/hanakivan/22e8131967dc1060fe260d196a0bba7d