DEV Community

Renan Lourençoni Nobile
Renan Lourençoni Nobile

Posted on

Why is React a library and not a (simple) framework?

In 2016 I started my career in development, and at the end of the year, I created a mobile app using Ionic 2 (Angular 2).

It was very familiar to me because I used to do C# and Asp.net, so the structure was similar and made it easy for me to learn, we had the app ready for download at play store in a couple (or maybe a couple's couple) of months.

From that time up to now I learned so many things and React got into my radar. During some time I bootstrapped a few projects but never gave them much attention. So when I finally started a project (and did some work on it), I realized that a lot of things were better than Angular, and a few I wish were like it.

But what "disturbs" me the most, is the fact that React is considered a library and not a framework.

When I think of a JS library, jQuery immediately comes to mind. All you got to do to use it is add the script in your HTML (or import however you like) and voila, $ is ready for you.

It doesn't feel the same way about React. Maybe it's just a lack of knowledge from my part but, it behaves much more like Angular than jQuery.

Of course syntax is different and whatnot, but when I think about the use of a library it's much simpler than react's.

Am I being ignorant to what React really is or someone else feels like this?

Thank you all very much.

Top comments (34)

Collapse
 
kayis profile image
K

People have different definitions for library and framework

One definition I know is:

  • a framework is a software where you plug your code into
  • a library is a software that you plug into your code

In terms of this definition, React is a framework.

But some people, especially in the front-end world, say a framework has to bring stuff like routers and/or widgets etc. pp.

So Angular, Ember.js and ExtJS are frameworks, but React isn't, because it only gives you the means to build components and render them into the DOM.

Collapse
 
renannobile profile image
Renan Lourençoni Nobile

That's a common argument. I was talking to a friend a few momments ago and he said the same thing.

But to me, it seems that although React is smaller than Angular, and needs to be incremented by other libraries (in this case, I think that projects like react-router, redux or styled-components are really libraries), it still is a framework.

Collapse
 
kayis profile image
K

I allow it.

Collapse
 
dkamer profile image
David Joseph Kamer

I'd have to say I use these definitions toargue that React is a library.

React is really only good for one thing: it's view library that give you a virtual Dom.

You can and should do everything else outside of react's lifecycle. The react lifecycle is only there to render your JSX (assuming you don't use react's built-in methods).

You should use pure js or other libraries to do anything other than render updates when you use react. State shouldn't be used for anything that doesn't directly effect rendering or render.

Collapse
 
thatjoemoore profile image
Joseph Moore

I am of the opinion that react (the package) is, in fact, a library. However, React as a whole has become a large ecosystem which is almost indistinguishable from a framework. While it is possible to use react as a library, in practice, one actually adopts a large number of tools and libraries from the React ecosystem. How many applications are there really that just use react without any related tooling or libraries?

The very fact that the default way of using react involves the use of a specialized DSL that isn't valid Javascript (JSX) tells me that no, React is not just a humble library. Is it a framework, though? Technically, probably not. However, the end result doesn't feel that different.

It reminds me a bit of the relationship between Ruby and Rails. While yes, technically, you can use Ruby without Rails, how many people actually do?

Collapse
 
renannobile profile image
Renan Lourençoni Nobile

This is exactly what I thought.

When I think about just react, it's a simple and powerful library, but when it comes to developing a React application, you'll will (almost) always need router, redux and some other libraries that are "specific" and necessary to react.

Collapse
 
cjbrooks12 profile image
Casey Brooks

Another way to look at the difference between a framework and a library is how opinionated it is about your application structure.

A framework will commonly request or mandate that you extend specific classes, or put files in specific locations within the project. In addition, a framework will very often start itself, and your code is somehow started at some unspecified point in the future.

In contrast, a library will rarely mandate where to put your files, though it might require extending certain classes. More likely though, a good library works on interfaces, or else you use it's classes but not create your own. In addition, a library knows it cannot start your application for you, so you usually have to manually initialize it yourself.

I personally have not used React and so cannot say which one sounds more accurate.

Collapse
 
lexlohr profile image
Alex Lohr

I think you confuse react with the whole ecosystem around it.

A framework covers the edges, whereas a library is a tool to fulfill certain tasks. React itself only handles one task: abstracted Web Components. It provides an internal state, lifecycles and external properties and with ReactDOM a renderer for a browser or similar environment - and nothing more.

This has a few advantages: it is smaller than a full-featured framework, is less opinionated on how to solve problems and therefore allows for more choice. Don't like react-router? Use another one - or no router at all, if you don't need any. Need a complex state management? Try redux. Need to handle side-effects? you can choose between redux-thunks, redux-sagas and redux-observables. Unit testing can be done with enzyme, jest or mocha, sinon, chai, jasmine, karma, etc. There's no one or best way to do it, so you can do whatever works best for you.

Collapse
 
githubmarcelnoack profile image
marcelnoack

So I guess the point that you and most of the other people here want to make is, that React itself, standalone, is technically! a library but because in 95% or so percent you will use the same libraries like react-router, redux, etc., the ecosystem of react is practically! a framework.

Collapse
 
lysofdev profile image
Esteban Hernández

We use React very much like JQuery, simply bringing it in as a dependency. However, we use Webpack to facilitate React development by sprinkling some JSX in the mix. Without Webpack, we'd have to write all of our elements in a very cumbersome API that is pure JS. Webpack also let's us optimize tons of other things in the background such as cross-browser compatibility (for the most part). So, I think this whole magical setup of a React project with Webpack using create-react-app is what gives us the false impression that React is a full-blown framework. However, when we compare what React provides us to Angular, we notice that React is just a component library when compared to Angular's routing, dependency injection, module management, etc. Also, Angular has some very opinionated ways of organizing the code base whereas React doesn't. When we use React, all of these additional features have to come from some other library, not Facebook (owner's of the React project).

Collapse
 
bennypowers profile image
Benny Powers 🇮🇱🇨🇦

Well there's react as in npm install react but that's not the same thing as the react you see on SO or job boards "React developer wanted" or "How do you filter an array in react?"

Collapse
 
renannobile profile image
Renan Lourençoni Nobile

That's a very good point, you don't see job titles like "jQuery developer", but React developer is all over the place

Collapse
 
bennypowers profile image
Benny Powers 🇮🇱🇨🇦

That's not exactly what I meant. "jQuery developer" used to be not commonly sought and still is here and there.

My point was more that when prior refer to react, they're usually intending to mean "in the manner of a react developer".

Thread Thread
 
renannobile profile image
Renan Lourençoni Nobile

Oops, my mistake. But I think I still don't get your point about the react developer

Thread Thread
 
bennypowers profile image
Benny Powers 🇮🇱🇨🇦

yeah I should have been clear.
The react library itself it fairly focused. It provides a JS-based component model, a virtual DOM abstraction, and that's about it.

But when people talk about 'react', that's not what they mean. They mean

  • webpack
  • jsx
  • maybe typescript
  • redux or mobx or some other state container
  • one of a variety of app architectures that have popped up in the react community
  • create-react-app
  • babel. So. Much. Babel.
  • probably jest

and the list goes on.

Thread Thread
 
renannobile profile image
Renan Lourençoni Nobile

Ohh yes, that's the point the, in my concept, makes React a framework or maybe something more than just a library, the amount of other libraries that creates the react ecosystem

Collapse
 
bgadrian profile image
Adrian B.G.

Because it does only 1 thing? Namely rendering components in HTML.

If it were a framework like Vue or Angular it would handle more problems like Routing, Animations and so on.

ll you got to do to use it is add the script in your HTML (or import however you like) and voila

React is available right away too, like jQuery, has global variables. But same as jQuery it does nothing if you do not call it.

Also search and read for articles named "Imperative vs Declarative jQuery", you will see why and how the paradigm shifted.

Collapse
 
milan090 profile image
Milan

Vue is a library right?

Collapse
 
peerreynders profile image
peerreynders

The litmus test:

  • If your code calls it, it's a library.
  • If it calls your code, it's a framework.

Looking at the React tutorial Starter Code ReactDOM.render() is the only part of React that your code calls. The rest, i.e. the majority of your code, is called by React.

Ipso facto - React is a framework because it is in control when most of your code runs.

For the expanded argument see: React is a (view component) framework

Collapse
 
mattwelke profile image
Matt Welke

Really good explanation. I like it has citations, because some people are very persistent in arguing Facebook's marketing that it's a library. It's confusing trying to teach junior developers about software engineering techniques when they come into the job under the impression that React isn't a framework.

 
apastuhov profile image
Aleksey Pastuhov

That means that Facebook is bad in terminology :)

Thread Thread
 
sigmademon profile image
SigmaDemon

Why would a social media brand like Facebook be entitled to define the terminology of React? lol

Thread Thread
 
evarosalene profile image
Eva Rosalene

I don't know but probably (probably!) it is because Facebook created React.

Collapse
 
bigbott profile image
bigbott

The correct definition that provides the difference between the library and the framework and the only one that makes sense :

"Your code calls library whereas framework calls your code."

Only this definition existed before unscrupulous React promoters started to promote it as a library.

React is obviously the framework. Very complex and opinionated one.

Collapse
 
vonheikemen profile image
Heiker

In my opinion React is a library. It does one thing, it let you describe how one piece of the interface should look like.

The interesting thing is that people choose to use it as a framework, by reaching out to other packages in the react ecosystem. What ends up happening is that your code lives inside React.

Take a look at this examples
React as a framework
React as a library

Collapse
 
renannobile profile image
Renan Lourençoni Nobile

It might look like that I dislike React, but the truth is I'm having lots of fun with it, and the learning process is steep but interesting.

I feel more productive with it, specially when it comes to creating components. Not having to declare every single component in app.module is a wonder.

The only thing I think is much more complicated, and it's probably due to my inexperience with React, is communicating with API (HTTP calls).

Collapse
 
alienfacepalm profile image
Brandon Pliska • Edited

It's definitely NOT a framework. Something like "Create React App" or "Meteor" are frameworks that use React, but React on it's own does not run, it doesn't really do anything by itself. It needs Webpack or Rollup and all kinds of other tooling just to get up and running. React is a view library, that has an approach, but that's it. Frameworks are complete puzzles, React is just a piece of the puzzle.

Collapse
 
martinhaeusler profile image
Martin Häusler

I think we've heard all the arguments by now. Let me ask a question instead: does it really matter if React is a library or a framework? What are the consequences?

Collapse
 
renannobile profile image
Renan Lourençoni Nobile

I don't think it really matter (in terms of usability), it's just interesting to see the discussion around this, and the points of view that makes this took so great.

I do believe that React should live in the middle of the framework vs library territory, but wether that's gonna change something I don't really think so.

Thank you for your input

Collapse
 
mattwelke profile image
Matt Welke • Edited

If it's two developers having a friendly (hopefully) debate, then it doesn't matter. It gets to be a problem though in real world contexts. If a company is mislead by their developers who are advocating that React be used instead of other frameworks because it's a "lightweight library", or if a junior developer learning how to organize their code is confused because "libraries" and "frameworks" appear to be used the same way in the front end JS world, then it's a problem.

Collapse
 
lcoenen profile image
Loïc Coenen

For me, Angular is a framework - it's highly opiniated makes implicit assumption about your code and when there's a problem, you get a cryptic error message such as

'Unexpected value 'undefined' declared by the module 'DynamicTestModule' with a stack trace as high as a building entirely located inside Angular itself.

React is a library because you plug it into the part of your code you want, it is checking its input correctly and is focusing on doing one thing and doing it good instead of trying to do everything the bad way.