[flutter] FutureBuilder 넌 모냐..

서민정·2023년 8월 2일
0

Future란?

특정 시점에 이용가능한 아직 확정되지 않은 값이나 오류를 표현할 때 쓰는 객체. 실행이 언제 완료될 지 모르는 값을 채우는 객체이다.

FutureBuilder란?

Future와의 상호작용에서 생겨난 스냅샷의 가장 최근 것을 바탕으로 위젯을 채우는 것

일단은 공식문서 번역해보기
FutureBuilder\ Class

Future는 State.initState, State.didUpdateWidget 또는 State.didChangeDependencies 보다 이전에 얻어지는 것이다. (응답이 오기 전에 일단 내뱉는 값이라고 이해하긴 했다.) FutureBuilder를 생성할 때 State.build 또는 StatelessWidget.build 메서드 호출 중에 생성되지 않아야한다. FutureBuilder와 동시에 Future가 생성되면 FutureBuilder의 부모가 다시 빌드될 때마다 비동기 작업이 다시 시작된다.

일반적인 가이드라인은 모든 빌드 메서드가 매 프레임마다 호출될 수 있다고 가정하고 생략된 호출을 최적화로 처리하는 것.

무슨 말인지 모르겠지만 나름대로 여러 글을 찾아보고 이해한 건 다음과 같다.

Future라는 건 껍데기인데, 미래에 올 데이터가 있을 수도 있으니 우선은 자리를 만들어두는 것과 같다. 그런데 우리가 위젯을 그릴 때, 항상 데이터가 도착한 이후에만 그릴 순 없으니 미리 위젯을 Future로 로딩을 해두고 (비워져있는 Future), Future에 데이터가 채워지는 것을 FutureBuilder의 snapshot을 통해 알아챈 뒤 채워지면 (hasData == true) 그 값을 위젯에 그리는 것!

FutureBuilder의 initState 메서드를 보면 다음과 같다.


void initState() {
  super.initState();
  _snapshot = AsyncSnapshot<T>.withData(ConnectionState.none, widget.initialData);
  _subscribe();
}

void _subscribe() {
  if (widget.future != null) {
    final Object callbackIdentity = Object();
    _activeCallbackIdentity = callbackIdentity;
    widget.future.then<void>((T data) { // 2
      if (_activeCallbackIdentity == callbackIdentity) {
        setState(() {
          _snapshot = AsyncSnapshot<T>.withData(ConnectionState.done, data);
        });
      }
    }, onError: (Object error) {
      if (_activeCallbackIdentity == callbackIdentity) {
        setState(() {
          _snapshot = AsyncSnapshot<T>.withError(ConnectionState.done, error);
        });
      }
    });
    _snapshot = _snapshot.inState(ConnectionState.waiting); // 1
  }
}
  1. _snapshot의 상태를 waiting으로 초기화
    • 여기가 먼저 실행되는 이유는 초기엔 widget.future가 null이기 때문이다.
  2. widget.future.then을 사용해 비동기 처리를 진행하고, 처리가 완료되면 _snapshot에 객체를 할당하며 상태를 done으로 설정한다.

즉, 초기에는 null로 설정하고 해당 future의 변경을 계속 subscribe 한 뒤, 비동기 처리에 대한 응답이 올 때 데이터를 세팅하고 상태값을 done으로 변경해주는 듯..! 싱긔하다.

profile
Server Engineer

0개의 댓글

Powered by GraphCDN, the GraphQL CDN