[Flutter] Vscode DevTools 사용하기

devTools를 사용하려면 debug 모드가 아닌 profile mode로 실행시켜야 한다.

launch.json에 다음과 같이 profile 설정이 되어있는지 체크를 먼저 해준다.

"configurations": [
  {
    "name": "Flutter",
    "request": "launch",
    "type": "dart",
    "flutterMode": "profile"
  }
]

 

그런 다음 모바일 기기와 연결한 상태에서 terminal에 아래 명령어로 실행한다.

flutter run --profile

 

그러고 나서 터미널을 보면 devTools에 접속할 수 있는 URL 링크를 알려준다

다음 vscode에서 devTools를 열어준다.

 

그러면 웹브라우저에서 devTools가 실행되고 터미널에서 알려준 링크를 입력하면 된다.

 

이렇게 Performance, CPU Profiler, Memory, Network, Logging, App Size 메뉴가 있는 DevTools를 만끽할 수 있다.

 

https://docs.flutter.dev/perf/ui-performance#run-in-profile-mode

Flutter performance profiling

https://docs.flutter.dev/development/tools/devtools/vscode

Install and run DevTools from VS Code

https://docs.flutter.dev/development/tools/devtools/cpu-profiler

Using the CPU profiler view