Alternatives to React: Other Lightweight Javascript Libraries

React is probably the most popular JavaScript library since jQuery for single page application (SPA) websites.

But not every website needs to be a SPA. Most of the time, you actually don’t even need the whole React library and its ecosystem, considering that its whole package (even when zipped!) is 45k.

The big problem when considering a substitute Javascript library is that there are many people who are pretty attached to React.

Choosing a right JS library for your project can be tricky. You need to consider the API, stability, ecosystem support, package size and performance. Fortunately for us, there are many options.

The ideal alternative would:

- Supply a slim compatible layer so you can use them in place of your current React project, potentially taking advantage of the existing React ecosystem (we will get to this later).

- Api-compatible with React, which means you can just replace React-DOM with whatever import provided by the library and your code should work the same.

- JSX support is always a plus. Most alternatives to React doesn’t support PropTypes, which is fine for most projects. You can always add TypeScript for type checking support if necessary.

So, what’re some good lightweight alternatives to React?

1. InfernoJS

This is probably the most high profile of them all (and not without the fact that its author recently joined the Facebook React team!) The InfernoJS team is proud of the fact that it’s one of the fastest Javascript libraries out there, clocking at 9k. The project has been in active development since its first release last January. It supports both JSX and hyperscript, as well as the Vanilla createElement method. Inferno also has binding support for various popular state management libraries like MobX, Redux and Cerebraljs.

If your application needs absolute performance, Inferno seems to be the best choice for you. Its focus on performance pays off immensely.

2. Preact 

If performance is not your first priority, then Preact may be a good replacement. Clocking in at just 3k gzipped, it’s one of the smallest React alternatives out there. Preact supports most modern browsers and IE9+.

Preact doesn’t support Facebook synthetic events system, so you may want to look elsewhere if you need cross browser event support. However, some may argue that removing synthetic events is a plus because you will not have to rely on yet another event paradigm. Preact added several nifty features such as linked state, rendering both props and state, and the utilization of ‘class’ directly instead of className.

3. React-Lite

React-lite was designed solely as a drop in replacement for React. It can be used directly via a webpack alias without the compatibility package that Inferno and Preact require.

The compatibility level to existing React components should be much higher than the other two, but it’s neither the smallest nor the fastest one of the bunch. It doesn’t support server side rendering nor does it support client side hydration. Even if you can use react-dom/server for those functions, the transition will not be seamless.

Benchmark Comparisons

Now let’s do a performance benchmark, using uibench. Unfortunately, React-Lite was not available so we can only compare between React, Preact, Inferno and Vanilla JS.

As you can see, Inferno consistently comes out on top in almost all tests. Preact comes ahead in the race to first render, then manages to keep up with React, except for the rare worst case scenario. Inferno with Inferno-compat, albeit slower than Vanilla inferno, fares pretty well against React.

With these libraries, you can fortunately remove API from the equation due to the fact that all of them provide compatible APIs to React.

Which alternative?

So, how do you choose the best alternative that works for you? Ask yourself what’s your first priority.

If you’re building a full-fledged SPA application and you need a stable product backed by a big company, then there is no alternative other than React.

If your application needs absolute performance, Inferno seems to be the best choice for you. Its focus on performance pays off immensely.

If you have an existing application built upon React and you need to reduce the package size, React-lite should help you since it has the best compatibility out of these three.

If you’re building a content website with progressive enhancement, your focus should be small package size and lean API, which either Preact, InfernoJS or React-lite is a good substitute.

If you’re building a full-fledged SPA application and you need a stable product backed by a big company, then there is no alternative other than React.

So even though React may have the most advantages, there are still plenty of viable alternatives.