Flutter Design Patterns and Best Practices Study #2

이책의 다음 내용은 아래와 같다.

element 가 사용하는 api updateChild

Element? updateChild(Element? child,Widget? newWidget,Object? newSlot) {
// a lot of code removed for demo purposes

final Element newChild;
if(child.widget == newWidget){
	newChild = child;
    } else if(Widget.canUpdate(child.widget,newWidget)) {
    child.update(newWidget);
    newChild = child;
    }
    
    return newChild;
 }

if 가 false 라면 위젯들은 곧 rebuild 된다.

이것을 방지하기 위해서 우리는 const 를 사용한다.

const의 기본 사용 방법을 보자

class ConstText extends StatelessWidget {
  const ConstText({super.key});

  @override
  Widget build(BuildContext context) {
    return const Text('hello world');
  }
}

const 로 선언된 클래스를 아래처럼 사용하기 보다는

class ParentWidget extends StatelessWidget {
  const ParentWidget({super.key});

  @override
  Widget build(BuildContext context) {
    return ConstText();
  }
}

아래의 코드처럼 항상 const를 사용하는게 좋다. 가능하다면

class ParentWidget extends StatelessWidget {
  const ParentWidget({super.key});

  @override
  Widget build(BuildContext context) {
    return const ConstText();
  }
}

사실 예제 코드라서 그렇지만 ConstText의 내부에는 이미 const Text가 존재한다.

이 코드를 사용할때 다시금 const로 사용한다면 어떻게 동작하는걸까?

위의 코드는 ConstText가 const로 선언되지 않았다.

그 말은 ParentWidget이 외부의 영향에 의해서 rebuild가 된다면

새로운 ConstText의 인스턴스가 생성된다!

첫 번째 빌드:
ParentWidget -> ConstText(인스턴스1) -> const Text(동일 인스턴스)

재빌드 후:
ParentWidget -> ConstText(인스턴스2) -> const Text(동일 인스턴스)
ConstText(인스턴스1) -> 가비지 컬렉션 대상

만약 ConstText에 const가 붙은채로 사용하게 된다면??

첫 번째 빌드와 재빌드 모두:
ParentWidget -> const ConstText(동일 인스턴스) -> const Text(동일 인스턴스)

우리가 막연히? 사용하던 const에는 이런 내용들이 숨어있다.

다음에 더 깊이있게 다뤄보도록 해야겠다.