This content originally appeared on Bits and Pieces - Medium and was authored by Thomas Sentre
JavaScript Frameworks vs Libraries — What’s the difference? That was the second question a recruiter asked me at my last technical interviews. I analyzed the question and responded with some basic definitions of frameworks and Libraries. The recruiter’s expression suddenly changed. I knew that I had made a mistake. Maybe I reversed the definition of these two concepts.
To avoid making such mistakes, let us spend a few moments familiarizing ourselves with what JavaScript frameworks and Libraries are, what they can do (and what they cannot), and how we should consider using them.
In this post, we will not only cover what is meant by JS frameworks and Js Libraries, but also look at how such frameworks are distinguished from libraries, what their major uses are, and when should or shouldn’t you be using one.
What are JavaScript Frameworks?
First, let us start our discussion by figuring out what exactly are JS frameworks.
In the simplest of words, a JS framework is an application-level entity that is used to define or put together the entire application design.
Confusing? Put it this way: A JS framework is a collection of components and code blocks that are required to perform a specific set of functions and actions. In other words, a JS framework is a body of predefined code that you can apply or use in your projects by combining it with your own code.
In this manner, a JS framework eliminates burden from the developer’s side by calling its various methods and components to perform particular functions. Note that here the developer’s code does not call the framework — it is the other way round. The JS framework outlines the guiding concepts for a given type of application (say, a single-page web app) and the actual code can be modeled around the same.
Naturally, depending on the level, complexity, and amount of functions that a given JS framework can handle, it can be a really big one or a rather small framework meant for a very specific niche task. Smaller or less-generic JS frameworks are often dubbed libraries.
Now, to better understand how the JS framework functions, consider this: Say, you can see that we have our own code that is meant to perform a given role.
However, it cannot function in its present state as it requires further functions, dependencies, libraries, etc. We have two options: We can code it all by ourselves and save hours and days working on it, or we can make use of a readymade JS framework that contains a predefined set of code that will perform the dependent actions required for our code to function. By combining the JS framework with the prewritten code, we can easily get the job done and save a good deal of coding time.
How are JS Frameworks different from Libraries?
Now that we have discussed what JS frameworks are, it is time to turn our attention to another entity that is often (incorrectly) used interchangeably with frameworks — JS libraries.
A library is a set of tools and code methods that help you perform particular tasks. On the other hand, a framework is more of a guideline that directs how you should present your code. The framework is generally not called by your code — instead, it is the JS framework that calls the code.
Whatever application you build, the code is structurally defined by the JS framework at large.
More often than not, many programmers find the distinction between libraries and frameworks to be rather blurry. However, it is not really that difficult. A JS framework will tell you how your project or application is to be structured. A JS library is just a set of components and blocks that you can use to perform a series of tasks within the said project or application.
JS libraries tend to be fairly easier to incorporate in projects. Irrespective of your coding methodology, you can work with JS libraries such as jQuery and incorporate them in your project with ease. JS frameworks, however, are often demanding in terms of implementation and organization.
It is generally a better idea to use a JS framework right from the start of a project and model your project around the framework. While you can easily incorporate a new library in an existing project, implementing a new framework in an existing project is often tricky business and requires quite a good deal of effort.
Thus, we can safely claim that JS libraries are more flexible than JS frameworks.
Now, to better understand how each can be used by your projects, consider this simple illustration: Let us assume that we are planning to build a JS application that acts as a calculator and performs basic mathematical functions. However, for each result, say addition or subtraction, it shows an animation when displaying the output.
As you can see, your code makes use of the JS library and calls its various functions or methods for a series of tasks, in this case, animations. The library itself is contained with the JS framework, which in turn calls your code to build the application, in this case, the calculator. This is a very simplified and straightforward example to help you comprehend how and where do JS frameworks fit in the bigger picture.
To simplify things, we can state that JS libraries are pretty much collections of classes and methods. The best and most obvious purpose of such libraries is the ability to reuse existing code and save time and effort therein.
A framework, on the other hand, provides a skeleton using which your app can define its own features that will be called by the framework as and when required.
Of late, certain JS libraries such as Prototype have evolved to such common level usage that they are clubbed under frameworks and libraries both. We will turn to this concept later in another post.
For now, it will do well to remember the following:
- A library is called by the code, whereas the JS framework itself calls the code.
- A JS framework is a semi-complete entity that provides a skeletal structure for your code to be based around it, to suit a given purpose or need. A library, unlike a framework, is a collection of functions that can be used by your project to perform just a particular set of tasks.
Why and when you should use JS Frameworks?
At this point, we have covered what frameworks are, how they differ from libraries in JS, and what benefits or drawbacks they provide.
Now, on to the bigger questions: Why should you use a JS framework? And when to pick which one?
The “why” part must be easier to answer. We have already covered the many benefits that JS frameworks can provide — ease of use, easier learning curve, better documentation and support, regular updates, etc. This means JS frameworks are, basically, tools to make life easier for you. Pretty much like an artist would use a specific set of colors or brushes simply because those may suit his or her artistic style, a coder may use a given JS framework because it suits his or her coding style and makes life easier.
But the bigger reason is the time and efforts that JS frameworks can save. Ask yourself, what would you prefer: Writing 150 lines of code to accomplish one task, from scratch? Or having a preexisting foundation at our disposal and writing barely 10 lines of code to accomplish the same task with the help of the said foundation? With JS frameworks, programming in itself can become less cumbersome.
Lastly, and this especially applies to you if you are a beginner-level JS developer — frameworks are developed, maintained and curated by JS experts who often know the language and its prowess inside out. This means for newer developers, JS frameworks can serve as handbooks or manuals that can encourage them to write better and cleaner code with efficient calls and arguments.
In fact, for this very reason, many highly experienced JS developers too tend to rely on JS frameworks. Some even go as far as coding their own JS frameworks so as to better utilize system resources and solve a given set of problems as per their requirements.
So, as you can see, using JS frameworks often has more advantages than disadvantages. But in this confusing world of several JS frameworks, which one do you use when?
The bigger names out there are Angular and React. Both are very well known in the field of JS frameworks and each has its own loyal following. However, Angular is more apt for building web applications that require just one module framework to play with. React, on the other hand, is more suited as an isomorphic web framework for UI development. Then, depending on the requirements and needs that your project has, you can opt for a specialized JS framework of your choosing.
For instance, if you are working with game engines or 3D scenes, Babylon is the JS framework that you need to be looking at. It combines WebGL with JS to give you the ultimate amazing 3D game engine cum framework. Similarly, for project and penetration testing, PhantomJS or Karma are ideal picks.
Conclusion
In this post, we have covered a good deal of basics related to the JS framework and library. By now, you should be aware of the following:
- What are JS frameworks?
- What are JS Libraries?
- How do JS frameworks differ from JS libraries?
- Why and when should you consider using JS frameworks?
All kind of Feedbacks are welcomed in comments.
Bit: Feel the power of component-driven dev
Say hey to Bit. It’s the #1 tool for component-driven app development.
With Bit, you can create any part of your app as a “component” that’s composable and reusable. You and your team can share a toolbox of components to build more apps faster and consistently together.
- Create and compose “app building blocks”: UI elements, full features, pages, applications, serverless, or micro-services. With any JS stack.
- Easily share, and reuse components as a team.
- Quickly update components across projects.
- Make hard things simple: Monorepos, design systems & micro-frontends.
Learn more
- How We Build Micro Frontends
- How we Build a Component Design System
- How to reuse React components across your projects
- Painless monorepo dependency management with Bit
How do JavaScript Frameworks differ from JavaScript Libraries? was originally published in Bits and Pieces on Medium, where people are continuing the conversation by highlighting and responding to this story.
This content originally appeared on Bits and Pieces - Medium and was authored by Thomas Sentre
Thomas Sentre | Sciencx (2022-07-08T07:23:45+00:00) How do JavaScript Frameworks differ from JavaScript Libraries?. Retrieved from https://www.scien.cx/2022/07/08/how-do-javascript-frameworks-differ-from-javascript-libraries/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.