Why is it not recommended to load ES6 Modules from CDN for Production?

1641
1
Jump to solution
07-13-2021 11:50 AM
RyanSutcliffe
Occasional Contributor II

I am excited about the use of ES6 modules now supported at arcgis javascript api 4.18+. I was surprised to see though, that while there is a CDN for the es6 modules, its use is not recommended for production.

I would have thought that it would be the opposite: installing and using a local build of the es6 module version of the API would be encouraged for development builds (you can run tests on a CI/CD, even without internet) but then for production you would use the CDN to offset traffic from your own servers.

Or is the idea that ESRI is saying, our CDN is not calibrated to support production apps, go build your own?

I tried searching through the docs for additional background/info but couldn't find any. Does anyone have any insight? Is there something I'm missing about the nature of the ArcGIS JavaScript API and how it is built that means it favors being bundled into your local build?

More details:

I see that the example for loading the es6 modules is using `<script type="module">` so it can import from a url. I haven't confirmed this but assume that you could customize your webpack setup so that you could do this too. I am also assuming that some webpack ju-jitsu could redirect es6 import statements like:

 

import Map from "@arcgis/core/Map";
import MapView from "@arcgis/core/views/MapView";

 

to be:

 

import Map from "https://js.arcgis.com/4.20/@arcgis/core/Map.js";
import MapView from "https://js.arcgis.com/4.20/@arcgis/core/MapView";

 

behind the scenes.

Tags (1)
0 Kudos
1 Solution

Accepted Solutions
AndyGup
Esri Regular Contributor

Hi @RyanSutcliffe unlike the AMD CDN, the ESM CDN isn't recommended for production use because it is "un-built" and not optimized. When you use it you'll notice there are dozens or even hundreds of CDN requests. Currently the recommended way to optimize ES modules for the best performance, whether they are ArcGIS JS API modules or not, is to use local build tools. That way your application gets a customized build that takes advantage of tree shaking, chunking, bundling, minimizing and obfuscating.

One item to note is that by default the @arcgis/core static assets are hosted on CDN to reduce the on-disk build size. You can override that by setting config.assetsPath and consume the assets locally if needed.

View solution in original post

1 Reply
AndyGup
Esri Regular Contributor

Hi @RyanSutcliffe unlike the AMD CDN, the ESM CDN isn't recommended for production use because it is "un-built" and not optimized. When you use it you'll notice there are dozens or even hundreds of CDN requests. Currently the recommended way to optimize ES modules for the best performance, whether they are ArcGIS JS API modules or not, is to use local build tools. That way your application gets a customized build that takes advantage of tree shaking, chunking, bundling, minimizing and obfuscating.

One item to note is that by default the @arcgis/core static assets are hosted on CDN to reduce the on-disk build size. You can override that by setting config.assetsPath and consume the assets locally if needed.