Stateless Widget vs Stateful Widget
한 번 렌더링되고 끝나는 것이 stateless
다른 상태를 렌더링을 가지고 있는 것이 stateful (클릭하면 바뀌는거)
stateful 위젯은 final로 만들면 안된다.
상태가 있는 위젯은 앱이 실행되고 난 뒤에도 상태가 변경되면 그림을 다시 그릴 수 있다.
값을 바뀐다고 그려지는게 아니라, 값이 바뀌고 build를 다시 호출해야한다.
stateless 위젯은 build가 딱 한번만 실행되고, stateful은 값이 바뀔 때마다 build가 된다.
Stateful 위젯 빌드흐름은 DFS탐색이다.
한 트리를 다 실행하고 나서 다음 트리 실행하는 구조.
부분 build를 하기 위해서는 컴포넌트 분리가 되어야 된다. 컨텍스트 분리가 된다는 말이다.
전체 build 안에 Logo라는 위젯이 내부에 build메소드를 가지고 있다면, 컨텍스트 스플릿이 가능하다는 말
컨텍스트 없이 그림을 못그린다. 컨텍스트는 도화지랑 같다고 생각하면 된다.
예시
실행되면서 num의 값은 3으로 build가 되었고, 순차적으로 num이 5로 바뀌었지만, build가 다시 실행되지 않았으므로 화면의 값이 업데이트가 되지 않았다.
stateful로 바꾸기
statelessWidget에서 alt + enter치면 statefulWidget 전환 메뉴가 나온다.
setState 함수
setState함수는 값이 바뀌면 build가 다시 실행된다. → 그림이 바뀐다.
컨텍스트 분리는 되었지만, 중요한건 아래 컨텍스트의 증가를 눌렸을때, 위에 숫자가 바뀌어야 한다.
컨텍스트를 분리하면 부분 리로딩이 된다.
그림을 그릴 땐 위에서 부터 실행이 된다 (아래에서 못올라간다)
그러므로 부모를 이용해서 상태값을 변경하면 되지만, 부모가 가지고 있는 모든 위젯들이 다시 그려진다.
전체 로드 할거면 굳이 왜 컴포넌트를 나누는가??
이렇게 공통 조상이 너무 멀게 되어있으면, 전체 페이지를 로딩해야 되는데, 이건 컴포넌트 설계가 잘못 된 것이다.
옵저버라는 기능을 사용하면 이런식으로 상태값이 달라지는 요소를 따로 관리해서 다시 그릴 수 있다.
const는 rebuild 될 때 다시 그리지 않는다.
상태가 없어야지 const를 사용할 수 있고, 한 번 new되고 나서 다시 new되지 않는다.
0