Notes on using JavaScript Libraries: CDN or npm

Note: This post is a details-post for the post: Learning web app development through free online tutorials – Organized Notes and Log, https://raviswdev.blogspot.com/2024/03/learning-web-app-development-through.html .

What is CDN in context of JS library? This is answered quite well by https://developer.mozilla.org/en-US/docs/Glossary/CDN. "CDNs are used widely for delivering stylesheets and JavaScript files (static assets) of libraries like Bootstrap, jQuery etc. Using CDN for those library files is preferable for a number of reasons: ..."

This seems to be an excellent article on CDN and how to use them, including specifying version numbers to prevent future versions of libraries used causing bugs in one's program: How to Import JavaScript and CSS from a Public CDN, https://www.freecodecamp.org/news/import-javascript-and-css-from-a-public-cdn/ . It has a section on "npm-driven CDNs" which can be used for JS libraries that are deployed only to npmjs. These npm-driven CDNs host libraries that are deployed to npmjs, and so we can use these npm-driven CDNs to use these libraries without using npm (Node package manager).

An interesting article: Should I install the package or use the CDN?, https://dev.to/jessachandler/should-i-install-the-package-or-use-the-cdn--4jia . The contributers there seem to agree that CDN can be used for test projects but for reliable solutions npm is better.

How to use a JS library or an npm package in a plain vanilla JavaScript project? The short video below gives a good explanation of how to use CDN (Content Delivery Network) for the JS library we need (not sure if all such packages have associated CDN)  and how to use Vite to create plain vanilla Javascript project and then add the npm package we need to it. The narrator says that CDN has lesser functionality than the package installed using npm (and then run through Vite). The last part of the video gets into Vite with React (a JS library). How to Add NPM to HTML CSS & JavaScript Projects, https://www.youtube.com/watch?v=qTnCSrp7Qmg , 13 min. 18 secs.