TIL - 기차 예매 서비스 (1) <Getx 종속성관리>

## 해당 TIL은 주어진 과제를 수행하면서 얻은 학습 내용과, 시행착오 등등을 종합해서 작성한것임

 

get | Flutter package

 

1. Getx 종속성 관리

Get에서 컨트롤러에 종속성을 추가하는 방법은 2가지가 있다.

// 직접 생성
Get.put(Controller());

// 지연 생성
Get.lazyPut<Controller>() => Controller();

 

직접 생성방식인 Get.put은 코드가 실행되는 그 타이밍에 컨트롤러를 생성(종속) 한다.

하단의 코드는 GetMaterialApp의 initialBinding 속성으로 Get.put을 컨트롤러마다 해주었다.

즉, 해당 컨트롤러들은 앱이 실행되는 순간에 컨트롤러가 일괄적으로 생성되게 된다.

initialBinding: BindingsBuilder(() {
    Get.put(ControllerA());
    Get.put(ControllerB());
}),

 

반면, 지연 생성방식인 Get.lazyPut은 생성대기 상태에 있다가, Get.find를 통해 호출될 때 생성된다.

하단의 코드는 GetMaterialApp의 initialBinding 속성으로 Get.lazyPut을 컨트롤러마다 해주었다.

즉, 해당 컨트롤러들은 앱이 실행되는 순간, 생성 대기 상태로 존재하다가, Get.find로 컨트롤러가 호출될 때 생성되어 사용된다.

initialBinding: BindingsBuilder(() {
    Get.lazyPut<ControllerA>() => ControllerA();
    Get.lazyPut<ControllerB>() => ControllerB();
}),

 

 

# 자, 여기서 문제점이 된 부분은 이곳이었다. #

GetxController의 LifeCycle 문제였다!

initialBinding: BindingsBuilder(() {
    Get.lazyPut<StationListController>(()=> StationListController());
    Get.lazyPut<SeatController>(()=> SeatController());
}),

 

두 컨트롤러를 lazyPut으로 설정한 상태에서,

HomePage에서는 StationListController가 한번도 호출되지 않은 상황이었다. (즉, SeatController는 생성되지 않은 상태)

// HomePage의 SeatSelectionButton의 onTap
Get.toNamed('/SeatPage');

 

해당 코드로 SeatPage로 넘어가면서, SeatPage에는 StationListController가 호출되었고, 정상 작동이 되는 상황이었다.

그런데!

 

문제는 back 버튼을 누르는 순간에 발생했다.

HomePage에서는 SeatController를 사용하지 않기 때문에, lazyPut의 특성상 사용하지 않는 인스턴스는 Delete 작업을 해버리는 것이었다!

 

이에, 다시 SeatPage로 넘어갈때, SeatController는 이미 Delete가 된 상황이라 재 생성이 되지 않게 되어, SeatPage가 정상작동 하지 않더라...

 

 

# 해결법은 2가지 # 

• Get.put 을 이용하여 앱이 실행될때, 컨트롤러를 생성해 유지하는 방법

이 방법은 사용은 간편하나, 메모리에 계속 Controller가 남기 때문에, 지금같이 크기가 작은 프로젝트에서는 괜찮지만, 프로젝트 크기가 커진다면 리소스 관리 측면에서 안좋을 수 밖에 없다.

initialBinding: BindingsBuilder(() {
    Get.put(StationListController());
    Get.put(SeatController());
}),

 

• Get.create 를 이용하여, SeatController가 필요한 시점에 계속 Controller를 생성해 주는 방법

이 방법은 매번 SeatPage로 넘어갈때마다 Controller를 직접 create 해주는 방식이다. 이 방식은 향후 마찬가지로 Get.delete 까지 해주어야 메모리 효율 측면에서 관리할 수 있다. 문제는, 코드가 길어지고, 직접 생성 방식이라 위젯 중간에 코드가 사용되어야 하며, 나중에 코드를 유지 보수 하는 입장에서는 매우 불편할 수 있다는 문제점이 존재한다.

// Get.create 하는 코드
Get.create<ControllerA>(() => ControllerA());

// Get.delete 하는 코드
Get.delete<ControllerA>();

 

과제는 프로젝트 크기가 작기 때문에, 1번으로 충분히 해결할 수 있었다.

다만, 향후 크기가 큰 프로젝트에서는 해당 상황들을 고려하여 종속성을 택할 필요가 있어 보인다..

 

 

2. GexController 의 Update

GetxController의 Update 함수는 StatefulWidget의 SetState와 역할이 비슷한데,

둘다 화면을 리빌딩 한다는 점이다. 즉, 해당 코드가 수행되면 필연적으로 컴퓨터 리소스가 소모될 수 밖에 없는 구조!

// GetxController 내부 함수
void getxControllerFunction(){
    // ...
    update();
}

// StatefulWidget 의 SetState 함수
SetState() {}

 

조금더 추가하자면, GetxController의 Update는 controller을 바라보고있는 모든 코드에 업데이트를 알리는 역할을 함 으로써, controller가 종속하고 있는 페이지에서만 리빌딩이 일어난다는 점은 알아두자!

 

즉, Update함수는 지금 당장 UI 에 영향이 있는 경우가 아니면 생략하여 불필요한 업데이트를 줄이는 것이 좋다.

 

 

# 따라서 프로젝트 내의 불필요한 Update 제거하기 #

// StationListController
void setStationType(bool type) {
    stationtype = type;
    // update();
}

// SeatController
void reset(){
    selectedcol = -1;
    selectedrow = -1;

    readyReservation = false;
    // update();
}