Hot reload Hot Restart

Hot reload Hot Restart

지난 시간에 이어 Hot reload와 Restart에 대해서 알아봅시다. Hot reload의 경우에는 코드가 변경 되었을 경우 바로바로 변경됩니다. 

 

아래 예시를 한번 봅시다. 

import 'package:flutter/material.dart';

void main() {
  runApp(
    MaterialApp(
      home: Scaffold(
        backgroundColor: Colors.red,
        body: Container(),
      ),
    ),
  );
}

예시 1

실행 후에 이런 예시가 보일 것인데 Colors.red를 변경해주면 당연히 hot reloading에 의해 바로 변경되어야 할 것 같지만 변경되지 않습니다.

 

그 이유는 Stateless, Stateful한 위젯이 아니기 때문입니다.

 

그래서 코드를 아래방법대로 변경해보겠습니다.

 

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Colors.red,
        body: Container(),
      ),
    );
  }
}

 

위 코드대로 StatelessWidget으로 변경하고 색을 변경해보면 자동적으로 Hot reloading에 의해서 결과물이 변경된 것을 확인할 수 있습니다.

 

Statelss(2)

여기서 Statless 클래스의 build 함수는 새로운 위젯으로 업데이트 될 때 마다 호출됩니다. 이말은 즉 색이 바뀔때 마다 새로운 버전의 위젯이 되니 hot reloading이 되는 것입니다. 코드를 한번 실행하면 알겠지만 엄청나게 빠른 속도로 화면이 변경된 것을 확인할 수 있다. 

 

이유는 앱의 모든 코드, 링킹 등을 해서 hot reload를 실행하는 것이 아니라 Statless에 위치한 build 함수만을 업데이트해주기 때문에 엄청난 속도로 hot reload가 실행된다. 

 

hot restart

번개 옆 버튼을 누르면 된다(초록 번개)

비슷한 기능으로 hot restart라는 기능또한 존재한다. 이는 hot reload와 다르게 자동으로 reload 되는 것이긴 하지만 state가 초기화 되어 버린다.  

 

즉 버튼을 눌러서 자동으로 증가시키는 앱을 만든다고 했을 때 증가한 데이터를 계속해서 유지하고 싶다면 hot reload, 기존의 데이터 또한 초기화 시키고 싶다면 hot restart를 해주면 된다. 

 

	hot reload	hot restart
새로 업데이트	o	o
state 유지	o	x