study: 리네다기 | 4장 - 불변성

리액트에서 객체와 배열 타입의 상태를 다룰 때는 항상 불변성을 지켜야 한다
불변성을 지킨다는 것은 객체 또는 배열을 직접 수정하지 않는다는 것을 의미한다

객체나 배열의 값을 변경할 때
새로운 값을 만들어 사용하는 것

불변성을 지켜야 하는 이유

특히 리액트에서 불변성을 지켜야 하는 이유는 렌더링 성능 최적화 방식 때문이다
리액트에서는 부모 컴포넌트가 리렌더링되면 기본적으로 자식 컴포넌트들도 리렌더링 된다

작성한 함수들이 한번 더 호출되는 것
문제는 자식 컴포넌트의 변경이 없을 때도 리렌더링 된다

리액트는 최적화가 잘 되어있어 리렌더링으로 인해 일반적으로는 성능 부하가 발생하지 않는다
컴포넌트가 리렌더링된 후 결과물이 기존 결과물과 차이가 있으면 UI 를 수정하고
그렇지 않으면 유지한다

컴포넌트에서 다루는 데이터가 많거나 연상량이 늘어난 경우
컴포넌트에 정말 변화가 발생했을 때만 리렌더링하도록 최적화할 수 있다
컴포넌트의 변화는 Props 를 통해 변경해야하는지 알 수 있다
컴포넌트 렌더링을 최적화하기 위해서는 Props 를 이전과 비교하는 과정이 필요하다

Props 를 비교할 때 리액트는 객체와 배열의 주소값을 비교하기 떄문에
내부 값을 변경하더라도 변경을 감지할 수 없다
불변성을 지켜 새 객체, 배열을 생성 후 비교하면 변화를 감지할 수 있다

객체나 배열 모두 스프레드 연산자
배열의 경우 배열 메서드를 사용하면 좋다