Difference between hot reload and fast refresh in react-native
The “hot reloading” feature was broken. It didn’t work reliably for function components, often failed to update the screen, and wasn’t resilient to typos and mistakes. They heard that most people turned it off because it was too unreliable.
In React Native 0.61, they’re unifying the existing “live reloading” (reload on save) and “hot reloading” features into a single new feature called “Fast Refresh”. Fast Refresh was implemented from scratch with the following principles:
- Fast Refresh fully supports modern React, including functioncomponents and Hooks.
- Fast Refresh gracefully recovers after typos and other mistakes, andfalls back to a full reload when needed.
- Fast Refresh doesn’t perform invasive code transformations so it’sreliable enough to be on by default.
Read more from the official docs
Fast refresh is great when we change the component for example style. It will only load the app on the current page. Most edits should be visible within a second or two.
Hot reload is to keep the app running and to inject new versions of the files that you edited at runtime.
for the Fast refresh If we edit a module that only exports React component(s), Fast Refresh will update the code only for that module and re-render your component.
If we edit a module with exports that aren't React components, Fast Refresh will re-run both that module and the other modules importing it.
If we edit a file that's imported by modules outside of the React tree, Fast Refresh will fall back to doing a full reload
In other words, it is great and more full than hot reload