A JavaScript framework is a set of pre-built code designed to support applications and provide benefits that pure JavaScript cannot.
If the idea of scaffolding isn't clear, consider pitching a tent. You build a frame to provide the structure of the tent. You can then add whatever you want to the outside and inside of the tent. Obviously, JavaScript frameworks are not like the physical structure in our tent, but the concepts are similar.
Before diving into the most popular JavaScript frameworks, let's take a moment to answer two frequently asked questions.
How is a Javascript framework diffierent from a Javascripti library?
A JavaScript library is a collection of code designed for a specific use case.
For example, Day.js is a library designed to simplify the use of dates in JavaScript - which can be complicated even for experienced developers. Another popular JavaScript library is jQuery, which simplifies the syntax for Document Object Model (DOM) traversal, event handling, animation, and other common tasks.
On the other hand, frameworks are built to provide multiple functionalities and form the backbone of a web application. Many frameworks, like Angular, build entire site trees. That is, they are used for the entire front end of the application. Others, like Vue.js, support incremental usage, which means your application can use the framework in a limited way.
You may use libraries in your application for specific use cases not covered by your framework. Think back to those pesky dates with Day.js. You don't need to use this library in views that don't contain dates.
On the other hand, if your application is built with Angular, then the page template is written in Angular's syntax regardless of what functions you leverage. In contrast, you can call Day.js in files where you need it and leave it out of files where you don't.
Why use Javascript framework?
Frameworks are built on top of standard JavaScript, so you can achieve everything that a framework does with just basic JavaScript. However, why write the same code when someone has already done it for you? The main benefit of using a JavaScript framework is to gain extra functionality without having to write all the code yourself. React and Vue.js are great for websites or apps that will be manipulating a lot of features, because they both use the virtual document object model (VDOM). The VDOM is faster at updating HTML elements, since it only updates the parts that need changing, whereas regular JavaScript will re-render the whole document object model regardless of how big the change was. There is more than one framework that can be used for a project. The best way to decide which one to use is to consider the top five frameworks, what their needs are, and how they work.