Angular main.js large file size with ES modules

ShaneBuscher · ‎05-03-2023

I'm working on an Angular 14 application which was using AMD modules via the CDN. I recently changed the app to use ES modules instead. The app works properly but I noticed a significant change in the size of main.js from 773 KB (AMD) to 3.9 MB (ES):

I didn't make any other changes. Wondering why the size of main.js increased after converting to ES modules and how to slim it back down?

@AndyGup ?

Thanks!

AndyGup · ‎05-03-2023

Hi @ShaneBuscher the size increase is because AMD modules are only being loaded at runtime, and they are not included in the app bundles. The ES modules (@arcgis/core) are being included and bundled along with the app. Here's a bit more info on bundle size: https://github.com/Esri/jsapi-resources/tree/main/esm-samples#bundle-size-and-performance. The app will only use the modules that it needs at runtime.

View solution in original post

AndyGup · ‎05-03-2023

Hi @ShaneBuscher the size increase is because AMD modules are only being loaded at runtime, and they are not included in the app bundles. The ES modules (@arcgis/core) are being included and bundled along with the app. Here's a bit more info on bundle size: https://github.com/Esri/jsapi-resources/tree/main/esm-samples#bundle-size-and-performance. The app will only use the modules that it needs at runtime.

ShaneBuscher · ‎05-03-2023

Makes perfect sense. Thanks!