"Fast Refresh" is a feature in React Native that provides near-instant feedback for changes made to React components during development. It combines the functionalities of the previous "live reloading" and "hot reloading" features into a more reliable and efficient system. Here are the key aspects of Fast Refresh:
Key Features and Benefits
Unified Reloading Experience:
Fast Refresh unifies live reloading (which reloads the entire app on save) and hot reloading (which updates only the changed files without losing state) into a single, more reliable feature[1].
Support for Modern React:
It fully supports modern React, including function components and Hooks, ensuring that changes are reflected accurately and quickly[1].
Error Resilience:
Fast Refresh gracefully recovers from typos and other mistakes, falling back to a full reload only when necessary. This makes it robust and reliable enough to be enabled by default[1][2].
State Preservation:
By default, Fast Refresh preserves the local state in function components and Hooks, allowing developers to see changes without losing the current state of the application. However, it always remounts class components without preserving state to ensure reliability[1][2].
Automatic Updates:
When a module that only exports React components is edited, Fast Refresh updates the code for that module and re-renders the component. If a module with non-React exports is edited, it re-runs both that module and the modules importing it. For files imported by modules outside the React tree, it falls back to a full reload[2][3].
Debugging Support:
Developers can use console.log or debugger statements during edits to aid in debugging. Fast Refresh also automatically retries rendering after saving a file, eliminating the need to manually reload the app after fixing errors[1].
