[React] 부모, 자식 컴포넌트 리렌더링 관계 (props,state)

리액트는 보통 부모 -> 자식 방향의 단방향 정보전달의 구조를 이루고 있다. 따라서 자식 컴포넌트에서 정보가 변하지 않고 부모 컴포넌트에서만 값이 변해도 자식 컴포넌트가 같이 렌더링 되는 불필요한 과정이 있다. 이를 해결하기 위해서 memo, useMemo, useCallback 등을 사용할 수 있는데 실제로 리랜더링을 얼마나 막아줄 수 있는지와 props로 객체가 전달되었을 경우에 대한 이해를 여러가지 케이스들을 실험해 보며 정리해 보자. 1. 세팅 먼저 간단한 프로젝트를 CRA를 활용해서 만들어 보았다! npx create-react-app react-render --template typescript components라는 폴더를 만들고 간단하게 부모 컴포넌트, 자식 컴포넌트를 만들어준다. //Ap..