Bundle JS assets for the V14 backoffice

[nikcio]

When the new Backoffice loads it makes a ton of requests for JS assets (~2000). Therefore I've been trying out bundling the Backoffice assets to see if any performance improvements can be gained.

The result?
We can definitely get some performance improvements by bundling the JS assets.

Proposal

Therefore as a proposal, I think we should consider bundling the JS assets with Rollup.

I'm not sure if this has any consequences for other use cases for the UI components in the Umbraco.CMS.Backoffice project which is why I'm starting this as a proposal instead of a PR.

Furthermore, I think this can solve the "Long path names" issues (Example) as bundling the assets this way will give a flat structure for the components.

Preview of file structure from the MVP PR further down:

(The entry point for everything is found in the file called index.js)

MVP of proposal:

nikcio/Umbraco.CMS.Backoffice#1

Find the test results in this PR

Next steps

The configuration set in the MVP PR needs to be set to meaningful values and we should consider if we can remove the other files being copied "as is" to the dist-cms folder by tsc --project ./src/tsconfig.build.json

Note: The PR shown isn't targeting the actual Umbraco repo so let me know if this is the way to go and I'll have a go at opening a "real" PR to the Umbraco repo

[iOvergaard]

Excellent, @nikcio #h5yr

We have initiated a bundling process on the JavaScript files already. We desire to bundle each module for itself because it knows how to expose its entry points. We have also had to untangle a few cyclic dependencies, which the bundling process has been excellent in exposing.

You will find that the upcoming 14.1 already loads far fewer files, and the process continues.