Should I Be Worried about React Fiber?

Photo of Paweł Jędrzejczyk

Paweł Jędrzejczyk

Updated Oct 7, 2024 • 6 min read

This week Facebook has officially announced React Fiber, a new version of its popular JavaScript library for building user interfaces.

The news from F8 2017 - Facebook Developers Conference that took place on 18-19th April - raised many questions and concerns among founders who developed their apps using React. Is there anything to worry about? Does this mean that they will have to rewrite their apps?

React Fiber is not a novelty for the developers who have already been familiar with the framework. The first mention of React Fiber popped up in 2014 when Facebook said that the engineers started working and experimenting on a new version of React. The community has been aware what was going to happen and could see the continuous progress on Github. The library has been transparent and available to the audience. Tuesday’s announcement came as no surprise to React developers. For them, React Fiber is just another fresh version of the library that offers more opportunities for developing faster apps with less effort.

Why Should I Care?

Yeah, what’s all the hype about? React Fiber holds out the promise of the fastest ever rendering engine. The new version will solve the problems that not many of us have ever encountered. However, with the current trends and the pace at which technology is evolving, complex apps of the future will require much faster rendering. Facebook anticipates future needs and is ready to satisfy them before they emerge.

1-2.png

What React Fiber Actually Is? - Key Things about the Library

1. Rendering Prioritisation

React Fiber introduced rendering prioritisation that will optimise the speed of your app. It enables stopping one rendering job in favour of other ones that can be done later. It means that more important components will be rendered in the first sequence, e.g. changes in the lists will give way to animation. You can find an excellent explanation from Lin Clark in this video.

Fiber improves the perceived performance and responsiveness for complex React applications - Lin Clark, Senior Developer Tools Engineer at Mozilla.

2. API Remains the Same

React has a strong API contract that remains the same and React Fiber will be backward compatible. The entire public API won’t change. Developers should not be worried about any problems with the new version. However, we can expect some disruptive changes as we always do with major updates.

We always had a strong API contract, so that gives us the flexibility to reimplement - Ben Alpert, Software Engineer at Facebook.

3-1.png

React Fiber is a complete, backwards compatible rewrite of the React core - Adam Wolff, Software Engineer and Architect at Facebook.

3. More App Logic

From a technical point of view, React Fiber modifies the reconciliation algorithm. It is based on more complicated logic and provides superior tools, so it gives you the possibility of much faster rendering when you need it.

4. Facebook is Already Using it on Their Side

There is no doubt that Facebook stays ahead with all the updates. They introduce new algorithms, libraries and upgrades to their app system way before they go public. The same goes for React Fiber - it’s already been used by Facebook, way before the big announcement.

2-1.png

3 Key Benefits of React Fiber (and a Potential Drawback)

1. Extremely Fast Rendering

You might not need it yet, but the future when we will need much faster engines to deal with complex apps is just around the corner.

2. UX Prioritisation

Fiber will make it possible to deprioritise rendering of the elements which are currently off screen so that they do not slow down crucial parts of the app.

3. Nothing Changes in Your App

Neither you nor your developers will notice any differences at first. There is no need to worry about rewriting the app. As Andrew Clark, a frontend engineer at Facebook said in 2016: If/When released, you shouldn't notice (at first).

Downside: We can expect a slight increase in the codebase volume. However, it should not influence the website's speed.

Look at the Future

To sum up, you don’t need to worry about rewriting your React app - the changes are only for good. Other libraries' authors are the ones who should be worried. React was once considered to be the fastest library for rendering user interfaces, and now, with Fiber, other libraries need to work really hard to be able to compete with it.

Photo of Paweł Jędrzejczyk

More posts by this author

Paweł Jędrzejczyk

Born in 1993. Coded the first website being only thirteen years old. Has been making the web better...
Web Development Services Hire web developers

Read more on our Blog

Check out the knowledge base collected and distilled by experienced professionals.

We're Netguru

At Netguru we specialize in designing, building, shipping and scaling beautiful, usable products with blazing-fast efficiency.

Let's talk business