What’s the Difference Between a Framework and Library?

Buy a house, or build one discreetly yourself?

What’s the difference between a framework and a library? I’ve had discussions with developers at work and at parties, and the core ideas boil down to the following:

With a library you tell the library what to do, and with a framework the framework tells you what to do, okay

Framework advantage

Generally, the framework tells you how to do it. It has the right way of doing things and provides the tools to support you.

Two perfect examples are Angular and Vue

All the tools are here

These frameworks were created by dedicated teams and contain everything you need to build large applications.

  • component
  • Basic state management
  • instruction
  • Handle form
  • routing
  • HTTP
  • test
  • More (UI libraries, animations, etc.)

2. Official Style Guide

Each team then provides an official style guide describing best practices for their framework. Once you know that, you can immediately improve your productivity.

3. Simplify the entry barrier

If you believe in structure and want to invest, then frameworks are ideal for your project. It’s also easier to train new team members because they only need to learn one core tool.

4. Specify the upgrade path

The most important thing is that your upgrade path is clear. Just stick to the team’s release schedule, read their big changes, and upgrade when you’re ready.

Framework disadvantage

This is just my personal experience. There must be something missing.

1. Performance degradation (somewhat)

The framework must contain a lot of code. More code means longer download times and lower performance.

But as frameworks become compilers, I suspect this will no longer be an issue.

2. Not for small projects

As we discussed above, a scalable architecture must address many issues. Using a whole framework for some simple applications can complicate things. The effort is not proportional to the gain.

3. Breaking the framework can be difficult

In my first job out of college, we tried to compile something outside of Angular consciousness, but the results were disappointing. After a lot of trial and error and a lot of frustration, we got the job done.

Although I’ve heard that Vue lets you apply existing applications step by step. That sounds very promising.

4. Learn a lot

This can be applied to any architecture, no matter what tools you use, learning all of them takes time. Either one big tool or a lot of small tools.

5. You slack off easily

This applies to everything in life. Sometimes we take things too easy by doing them a certain way. It all depends on your career goals. Maybe this tool helps you keep a steady job or run an efficient business build application. If that’s what you want, go ahead and do it.

But if you’re like many of us, it’s a little stale to use the same techniques every day. Experimenting with other frameworks or libraries is key to maintaining our skill level.

The advantage of the library

In contrast to frameworks, libraries are utilities built for a single purpose.

  • ReactBuild the UIs
  • ReduxProvide state management
  • jqueryProvides cross-browser DOM manipulation

Moving on to the list, let’s zoom in on React to see what it does.

A JS library for building user interfaces

1. The single focal point

That’s all. Their tutorial shows you how to use React, and that’s the main thing. Their team has no officially appointed library for global state pipelines, routes, HTTP, services, or forms.

That was their design choice. Whether that’s good or not depends on what you’re looking for.

2. The ball is in your court

For libraries, you have percentage control. You can decide how to use it and spend some time learning it to make sure everything goes well.

3. Only add what you need

If your application is small, one library is enough! It doesn’t need to be complicated. As your app grows, you can mix and match different libraries to build your own architecture, which can be a great learning experience.

4. Learn lots of different tools

Having said that, using different libraries will keep your JS skills polished. You’ll be constantly reading documents, trying new things, and expanding your technical horizons.

Although it’s not perfect…

Library of disadvantage

Custom architectures can break your application

Custom architectures are fun at first, but can be very expensive in the future. Be extra careful if you’re building for the first time.

A good architecture improves the efficiency of development and minimizes the hassle of adding, modifying, and removing code.

A bad architecture causes fear and torture to whoever touches it.

People choose Angular and Vue because they don’t want to take too much risk and money to build their own rules. They simply learn the rules of the framework and focus on playing the game.

In the React world, the structure of any two large applications will be different, depending on what the team thinks best

Dysphoria

Sometimes too many options can be a bad thing, and we are struck by the dreaded choicelessness. Instead of picking a library and moving forward, we spent countless hours comparing different libraries that did almost the same thing

There’s a lot to learn

A large application takes time to understand, whether it has a framework or not. This is another reason why a strong architecture is so important, because it simplifies the learning process.

Potential upgrade paths

If I could get paid for incompatibility between two libraries in my package.json after every upgrade, I could retire. I don’t want to say more.