Flutter: Seamless Multi-Device Debugging
At times, it can be incredibly useful to debug a Flutter app across multiple devices simultaneously. Surprisingly, this feature seems overlooked or underutilized by many. However, the reality is that it’s remarkably straightforward to use, especially in VS Code. What’s more, there’s no need for any additional configurations, such as modifications to the launch.json file, contrary to what some sources might suggest.
Starting debugging on multiple devices
This Flutter repository’s Wiki page, which dates back to 2019, outlines the utilization of the VS Code multi-targeting feature via a compound launch configuration. However, it’s worth stressing that this method is just one among several, as indicated in the VS Code documentation.
An alternative and simpler way is to just start another debug session on any other device from your devices list in VS Code after you’ve already started the first debug session. That’s it!
Demo
Caveats
The Hot Reload button on the debug toolbar does all sessions, but Hot Restart only does the active session.
Hot reload vs. hot restart
Hot reload works by injecting updated source code files into the running Dart VM. This includes not only adding new classes, but also adding methods and fields to existing classes, and changing existing functions.
A few types of code changes cannot be hot reloaded though:
- Global variable initializers
- Static field initializers
- The
main()method of the app
