On Feb. 19, State of Frameworks speakers, including many of the best and brightest from the development world, gave us updates on all things frameworks.
Michael Jackson, a creator and React router and owner, shared some updates about what’s coming up at React.
Michael Jackson — Creator, React Router & Owner React Training — @mjackson
The 16.6 release of React now features code-splitting. Code-splitting is based on the idea that, instead of delivering one large bundle to your users, you just provide them with the main bundle and can give them other, smaller bundles as needed.
React.lazy and React.suspense are the mechanisms that manage code-splitting. Check the React documentation for more details on this feature.
Hooks allow you to “hook” into the underlying React lifecycle and other features They shipped in React 16.8.
7–8 hooks are currently available, each with a different function — opening up many new possibilities for developers. “Refs,” for example, deals with persistent values between render calls, while “Effect” can create side effects or “non-pure” things like timers and imperative DOM mutations.
React hooks are stable and were released in 16.8. If you go to Reacttraining.com, you can register for one of our upcoming workshops where you can learn more about hooks and how to use them.
There are a number of new features that React will be rolling out over the next year.
One is React concurrent mode, which refers to the idea that React has the ability to prioritize certain types of work over others. User interactions like scrolls or key presses, for example, can be prioritized above others, like rendering some view on the main thread. Concurrent mode should be landing later in 2019.
Concurrent mode will enhance suspense mode as well, leading to better performance possibilities. If you’re loading a bundle right now, you’ll get a spinner and timeout. Suspense mode, however, will give you the ability to wait for that work to happen.
In 2019, React will also roll out support for data fetching inside suspense mode. With data fetching, you can wait for some asynchronous IO to happen before rendering a tree.
Finally, the React team implemented a simple cache model with an API they’re using for asynchronous implementation. A React cache module should be released in 2019 as well.
Beyond React Core, ReactJS.org is also undergoing some exciting updates.
ReactJS.org is being translated into a number of languages from all over the world. Currently, over 16–17 repos are available in languages like French, Spanish, Portuguese, Armenian, Dutch, Arabic, and many others. This will allow even more contributors to get involved.
If you want to help out with the ongoing translation project or any other React initiatives, head over to github.com/reactjs.