Why do the SPFx tutorials configure a library or a folder in an library as a CDN to host assets like scripts, images etc?
I mean what is the technical difference to hosting the assets in the SiteAssets library without creating a CDN with some powershell commands first? Is it really necessary to use a CDN or can I just use the SiteAssets library like I always did for my various projects in SharePoint on prem?
The tutorials configure a library or folder in a Doc Lib as CDN because of the immense performance benefits that are gained once it is enabled.
In our tenants, post enabling of CDNs, we saw a performance gain of upto 30-40% while fetching assets like CSS and JS files. This rendered the pages quickly for end users. It executed the JS files faster, painted the page canvas faster and reduced lag and zig-zag effect. Needless to say, our page load times reduced a lot because of it. This is because of the nature of CDNs themselves, as in, they work as caching mechanism and store static assets like JS, CSS, images, favicons etc closer to the user's environment.
While enabling CDNs is not necessary, it is considered as best practice.
You can obviously upload your assets to the SiteAssets or any other doc lib accessible to end users and serve the files from there.
In SPFx, you can set the path in the cdnBasePath of the write manifests json file, but then you need to upload your files yourselves there.
If your have kept the cdnBasePath empty and your CDN is not enabled, those files will be served from the App Catalog site collection. The place where you upload the app is also a document library itself from where these files will be served.
reference - O365 CDN
CDNs typically set a long caching timeout. Browsers can reuse local cached content without re-downloading for each new page load. CDN content can also be distributed across multiple data centers.
For documents, you usually want the current copy of a file from a library, not one several hours old. No do not store these in CDNs.
