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.
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.
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.
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.