A brief overview of the React 17
First things first, yes there are no new features in this update! There are several upgrades and a few eliminations which we believe are worth discussing.
So here’s our take on the all-new React 17.
This new version comes after a long wait of nearly two years. We believe that there are a lot of improvements vis-a-vis the previous version. The focus is largely on the gradual updates to this version and the future ones.
So, let’s see what all they are!
Changes in event delegation
The React 17 update eases the nesting of applications that are built using different React versions. A lot of conflicts were seen when many versions of React are being used together. With this update, event handlers will not be attached at document levels. In its place, it will go to the root DOM container where your React tree is rendered.
Also, with React 17 going in for gradual changes, developers will have more freedom when it comes to migration of apps in one go or smaller chunks.
Native component stacks
Finding errors with javascript function; its name and location stack trace can lead to a needle in a haystack hunt while sifting through hundreds of coding lines (if not a thousand).
To pinpoint errors in React 17, there is an unorthodox approach taken by the React team. Here is what they are thinking, in their own words:
Currently, the browsers don’t provide a way to get a function’s stack frame (source file and location). So when React catches an error, it will now reconstruct its component stack by throwing (and catching) a temporary error from inside each of the components above, when it is possible.
This improvement will come in handy during the production environment.
No private Exports
This is more specific for React Native for Web. The older versions will no longer be compatible with React 17. It was due as well since React Native for Web is required to align with the internal changes following this update.
No event pooling
Event pooling optimizations are no longer a part of React 17. It was supposed to improve performance in older browsers but that didn’t happen. Additionally, for developers, this means lesser confusion, and the need to use e.persist() is now eliminated.
Properties of React Components
React 17 is now compliant with ES6. There are talks of using key or codes and in case you are working with it, you are required to code property to keyboard event objects. On similar lines, capture phase events use real browser capture, there are no bubbles in onScroll events, etc.
In addition to the above-mentioned updates, two new functions are being introduced in this update, namely ‘getDerivedStateFromProps’ and ‘getSnapshotBeforeUpdate’.
All this said, React 17 is surely working towards making React more prominent within the developer community and making it easier for all to understand, deploy, and migrate to React in the future. Feel free to get in touch with us here if you need help with your React development.
About us
We, at Galaxy Weblinks, are all for new ideas and experiments. We believe that being up-to-date in this fast-paced world gives us adequate time to explore and implement new changes. Our developers are constantly striving for improvement and a better user experience. Contact us for a free consultation!
Originally published at https://blog.galaxyweblinks.com on November 3, 2020.
