Enabling Fast Refresh in Expo (also known as Hot Reload or Live Reload) significantly improves development efficiency by allowing you to see results immediately after code changes without manual app refreshes. The following are the steps to enable Fast Refresh in Expo:
1. Start the Development Server
First, ensure you have started the Expo development server using the command below:
expo start
2. Open the Developer Menu
- Android device/emulator: Open the Developer Menu by shaking the device or pressing
Ctrl + M(in the emulator). - iOS device/emulator: Open the Developer Menu by shaking the device or pressing
Cmd + D(in the emulator).
3. Enable Fast Refresh
In the Developer Menu, select "Enable Fast Refresh". This activates the Fast Refresh feature.
Example
For example, when developing a React Native application and adding a new button component, you can immediately see changes to its styles and functionality with Fast Refresh enabled—no app restart or manual refresh required.
Once Fast Refresh is enabled, saving code changes causes the app to update only the modified parts rather than the entire application. This makes testing new features or fixing bugs faster and more efficient.
Notes
- Ensure your app is not running in production mode, as Fast Refresh is only available in development mode.
- In some cases, if changes involve underlying logic or state management, you may need to fully restart the app to correctly load all changes.
These steps should help you enable Fast Refresh when using Expo for React Native development, improving your development experience and efficiency.