With Facebook’s founder testifying to the U.S. Congress, in unrelated news, the company’s React.js UI library for JavaScript recently received a new update. Version 16.3 of React provides a host of new features for developers hoping to add some efficiency to their web applications. If you are interested in downloading it, the update is available on Facebook’s own GitHub repository.
If your team isn’t using React, check out our previous articles covering it and its mobile variant, React Native. What follows is a high level overview of React version 16.3. News about the new update appeared in InfoWorld, among other sources.
The main changes in the updated version of React involve improved management of the component lifecycle, as well as a new API to help developers better deal with context in their application. These new component lifecycles include: getDerivedStateFromProps and componentWillReceiveProps, which gives programmers a safer option than using the legacy versions. Another one, getSnapshotBeforeUpdate, safely handles the reading of properties before performing an update.
Some lifecycles are receiving an “unsafe” prefix to warn developers not to use them. Runtime safety isn’t the issue as much as the likelihood of deprecated functionality and subsequent incompatibility with future versions of React. In short, they are warning you about potential future bugs. Another reason for this is providing a “heads up” to engineers maintaining open source applications using React.
Facebook engineer, Brian Vaughan commented on what led to this new lifecycle functionality. “A few days ago, we wrote a post about upcoming changes to our legacy lifecycle methods, including gradual migration strategies. In React 16.3.0, we are adding a few new lifecycle methods to assist with that migration,” said Vaughan.
Another option involves using the new StrictMode component. This serves to identify any unsafe legacy lifecycles when running in development mode. It also warns about other side effects from using older lifecycles and React functionality. Expect additional features to be added to this component in future updates.
In addition to providing a boost in efficiency, React’s new Context API allows for static type checking and deep updates. Data is able to be passed through a component tree without the manual inclusion of props. The old API is expected to still work for a few more versions, so start updating your code to use to new one.
Facebook cautions about overusing the new API. “Don’t use context just to avoid passing props a few levels down. Stick to cases where the same data needs to be accessed in many components at multiple levels,” said the social network’s development team.
Other fresh features in React 16.3 include a new API for managing refs, called createrefAPI. This lets programmers access DOM nodes or React elements derived from the render process. The forwardRef API facilitates code reuse by help devs use higher-order components for this purpose.
Since React is effectively becoming a standard for UI development in web applications, we hope this look at its latest version provides some insights for you and your team. As always, thanks for reading the Betica Blog. We hope to see you again very soon!
Posted on April 16, 2018 | Categories News, Software Development | Tags Agile, API Testing, devnews, Game Development, Microsoft, News, React.js, reactjs, Software Development, software engineering