No, React doesn't weigh 2.6KB...

NicolasBrondinBernard

Author
@NicolasBrondinBernard

or how to find the real size of a JavaScript framework.

Article published on 29/01/2021, last updated on 10/08/2026

Today, while I was in the phase of choosing technologies for the stack of a new client project, I came across a blog post presenting Svelte, among other things.

The article was interesting, but a table at the beginning of the article comparing the sizes of different JavaScript frameworks caught my attention when I read: "React -> 2.6Kb (minified and compressed)".

Note that even though I use the word "framework", most of these technologies are actually libraries, I actually wrote a dedicated article to understand the difference.

From memory, VueJS reaches around 60Kb (compressed), and even if the latter is slightly heavier than React, there's no way the ratio could be 1:23!

The icing on the cake was that a few days before I had started reading the documentation of Preact, a framework that could be described as "react-lite" and whose main quality is that it only weighs 4Kb (compressed).

What would be the point then of having a less complete framework that's almost twice as heavy? It made no sense.

To get to the bottom of it, I went to check this information on Bundlephobia, a platform that allows you to see the nominal, compressed, and gzipped size of all packages available on npm.

And there, surprise, same result!

But it's while searching directly on Google that I came across this answer which tipped me off:

Reading it quickly, you might think it actually confirms the previous information, but reading to the end you can see an essential piece of information:

"react + react-dom is 109kb (34.8kb gzipped)"

Even though the answer dates from 2017, the key to the solution is right in front of us, the web version of React.js is split into 2 modules "react" (the core of the framework) and "react-dom" (its web rendering engine).

This separation is notably due to the emergence of React-Native which shares the same core as the web framework, hence the split into two distinct modules.

If you don't know what React-Native is, I wrote an article explaining how it works in a simplified way a few months ago.

In order to confirm this information and have up-to-date data, I simply created a new empty react project with the command "npx create-react-app [NAME]" and I was able to analyze the size of the dependencies by directly submitting the "package.json" file to Bundlephobia:

Result: the real size of the "complete" React JavaScript framework in a web environment (minified+gzip) is 42.3Kb.

The purpose of this article is to make you understand that you should always verify and cross-check your sources of information, to err is human but we must do our best not to spread the error!


Maranda Vandergriff sur Unsplash

Finished reading this article?
Our complete courses
Take it to the next level with our courses!

Complete courses, exercises and certificates to really learn programming!

4.8 average rating

Comments (0)

to leave a comment

No comments yet