Why are there so many JavaScript libraries

Javascript Libraries jQuery to Angular.js

Javascript is a young programming language and was not designed for complex applications, but was initially intended for simple effects and to help with forms.

There are now countless code libraries for effects such as lightboxes, for animations and presentations. Others are powerful frameworks and for recurring tasks - from navigating through the DOM to accessing server applications (XMLHttp-Request, Fetch). Most Javascript frameworks / libraries are open source and intended for user interaction with applications or apps.

They iron out the differences between the browsers so that older browsers (especially older IE versions) are also dragged along. Others are dedicated to special topics such as THREEjs around WEBGL for 3D animations based on the canvas element.

Vanilla JavaScript or jQuery & Co?

With the blissful end of IE9 and IE10, ECMAScript 2018 took a big step forward as a usable version for Javascript (ECMAScript is the standard for scripting languages ​​such as Javascript and ActionScript).

Vanilla JS refers to Javascript without the use of libraries or frameworks. The evergreen browsers support ECMAScript 6 on a broad basis. It is worthwhile to reconsider the use of Javascript libraries such as jQuery, frameworks such as Angular and Vue and Vanilla Javascript - just use Javascript.

$ ('# my .super selector');
document.querySelectorAll ('# my .super selector');

Example of YOU MIGHT NOT NEED JQUERY

https://iainbean.com/posts/2020/your-blog-doesnt-need-a-javascript-framework/

Include Javascript libraries

Libraries and frameworks eliminate the browser differences, all offer easy access to Ajax functions. Anyone who wanted to use professional web design with effects and assistance for the user could not avoid jQuery for over a decade. When performance is required today, every millisecond counts or only a small part of jQuery is used, Vanilla Javascript is more efficient.

jQuery

By far the most used and most modern code library for Javascript. jQuery specializes in displaying the HTML page as DOM and Ajax. We mainly use jQuery to select elements of the DOM (nodes). For a long time, jQuery filled the gaps in the Javascript programming language and now ensures compatibility in older browsers.

jQuery Mobile

Javascript library for web applications on mobile devices - especially touch devices.

Angularjs

AngularJS 2 is a comprehensive framework. After the redesign of Google, AngularJS provides the most modern objects and services for applications and websites with Javascript. An upgrade from version 1 to version 2 is not possible.

AngularJS is built around components - own tags for which special functions are developed. The directives from the first version no longer exist.

React

React is a Javascript framework (a complete development environment) for programming the user interface and is primarily used for applications such as content management systems and shops - rarely for simple websites. In addition to Facebook, the Gutenberg editor in WordPress / Drupal uses React.
React is well documented and already uses elements from ECMAScript 6.

D3.js

D3.js is a library for data visualization, can e.g. build tables from array values ​​without much paperwork and has its strength in the animation of graphics. Similar to jQuery, D3.js is based on the selector interface of the W3C.
With a weight of around 250 KB, D3.js is suitable for extensive applications and when using progressive web apps.

CreateJS

Modular Javascript library for animations with HTML5: EaseLJS (HTML canvas programming, TweenJS, SoundJS, PreloadJS and Zoe)

I left out Vue.js. Should be in here too.

As an alternative to downloading the large libraries, the Javascript frameworks are available via CDN (Content Delivery Network). If the visitor to a website has previously visited another website in which the same library is used, the library is still in the visitor's cache and does not have to be reloaded. The CDN also relieves the burden on your own server.

Optionally, libraries can be managed with a Github account. Then the current stable version of the library is always integrated.

During development, it makes sense to work with a local copy of the library - then the program can also be tested without a connection to the Internet.

When is it worth using libraries?

With the help of libraries, a moderately experienced programmer can create complex applications with a steep learning curve. Even experienced programmers gain insight into the functions.

Libraries also have their downsides: They come and go. Beginners who rely too one-sidedly on the use of libraries and frameworks will one day miss the boat. The update from AngularJS to AngularJS 2 is an example of a drastic change from one version to the next.

Web Tooling is like Game of Thrones, fall in love w / a tool & hope it doesn't get killed off

Tweeted by Google Developers

And in the background the question should always be: Is it worth transferring 100 KB, 200 KB and more to script code for the amount of relevant information and the appearance of the user interface? With mobile devices in particular, the amount of data gnaws at the data volume and we mustn't put sustainability behind the last button on the page.

External sources