Hot Reload vs Hot Restart
Hot Reload vs Hot Restart
About
- Hot Reload: Inject updated code while preserving app state.
- Hot Restart: Fully restart app with new code.
- Critical for Flutter developer workflow.
- Different use cases and performance characteristics.
Main Topics
-
Hot Reload
- Definition: Incremental code injection.
- Example:
// Change widget code → preserve form input
-
Hot Restart
- Definition: Full app restart.
- Example:
// Change app initialization → requires restart
-
State Preservation
- Definition: What gets preserved.
- Example:
// Hot Reload keeps: // - Form data // - Navigation stack
-
Performance
- Definition: Time comparison.
- Example:
// Hot Reload: ~1s // Hot Restart: ~5-10s
-
When to Use Each
- Definition: Appropriate scenarios.
- Example:
// Use Hot Reload for: // - UI tweaks // - Style changes
How to Use
- Hot Reload: Ctrl+\ (VS Code)
- Hot Restart: Ctrl+Shift+\
- Debugging: Use when state matters
- Initialization: Requires restart
How It Works
-
Hot Reload:
- Dart VM updates classes
- Widget tree rebuilt
- State preserved
-
Hot Restart:
- Full app reboot
- Fresh state
- Re-runs main()
Example Workflow:
// 1. Edit widget style → Hot Reload
// 2. Change global variable → Hot Restart
Conclusion
Hot Reload and Hot Restart are complementary tools in Flutter’s development workflow. Hot Reload enables rapid UI iteration while preserving application state, while Hot Restart provides a clean slate when fundamental changes require complete application reinitialization, together significantly boosting developer productivity.