Many JavaScript libraries are available on public CDNs, such as cdnjs.com. This makes it possible to not only avoid bundling a library with your own app build, but also leverage previously cached loads of the library, much like web font loads are expedited for everyone when the whole internet share’s Google’s font server.
Even if, for security reasons, you insist on serving a library yourself, you can theoretically make all your apps source the same URL for that library, so that it only needs to be loaded the first time any single app from your site is loaded. Then, all subsequent app loads – of either the same app, an upgraded version of it, or perhaps even other apps on your site – would then not need to load the previously cached library.
When I build an Angular app, the Angular runtime is bundled with it. If I build and deploy 10 different Angular apps using ordinary methods, the runtime is bundled 10 times, and is redundantly loaded by the customer 10 times if the customer visits all 10 apps.
I noticed cdnjs provides core Angular sources. Is there a way to build an Angular app such that the Angular runtime itself is loaded separately, to leverage caching when jumping between apps? I imagine this probably requires some webpack wizardry.
Similar question here, except that the question is too generic, and I wish to focus on caching of the Angular runtime itself.
I realize there are a few reasons I might not want to do this – external dependencies, security, extra HTTP connections, loss of tree shaking within the Angular runtime, etc. I want to know how to do this, regardless of whether or not I should.
