React Native 0.61 introduces Fast Refresh for reliable hot reloading

Last week, the React team announced the release of React Native 0.61. This release comes with an overhauled reloading feature called Fast Refresh, a new hook named ‘useWindowDimensions’, and more.

https://twitter.com/dan_abramov/status/1176597851822010375

Key updates in React Native 0.61

Fast Refresh for reliable hot reloading

In December last year, the React Native team asked developers what they dislike about React Native. Developers listed the problems they face when creating a React Native application including clunky debugging, improved open-source contribution process, and more.

Hot reloading refreshes the updated files without losing the app state. Previously, it did not work reliably with function components, often failed to update the screen, and wasn’t resilient to typos and mistakes, which was one of the major pain points. To address this issue, React Native 0.61 introduces Fast Refresh, which is a combination of live reloading with hot reloading.

Dan Abramov, a core React Native developer, wrote in the announcement, “In React Native 0.61, we’re unifying the existing “live reloading” (reload on save) and “hot reloading” features into a single new feature called “Fast Refresh”.”

Fast Refresh fully supports function components, hooks, recovers gracefully after typos and mistakes, and does not perform invasive code transformations. It is enabled by default, however, you can turn it off in the Dev Menu.

The useWindowDimensions hook

React Native 0.61 comes with a new hook called useWindowDimensions, which can be used as an alternative to the Dimensions API in most cases. This will automatically provide and subscribe to window dimension updates.

Read also: React Conf 2018 highlights: Hooks, Concurrent React, and more