리액트에서 리랜더링이 일어나는 경우

React에서는 주로 데이터의 변경이 일어날 때 컴포넌트의 리렌더링이 발생합니다. 여기서 데이터는 컴포넌트의 props나 state를 의미하며, 이들 데이터가 변경될 때 해당 컴포넌트와 그 하위 컴포넌트들은 리렌더링 됩니다.

리렌더링이 발생하는 몇 가지 일반적인 시나리오를 살펴봅시다:

1. State 변경: 컴포넌트의 state가 변경될 때마다 해당 컴포넌트는 리렌더링됩니다. 이것은 React의 핵심적인 개념입니다. setState 함수를 호출하여 state를 변경하면, React는 새로운 state를 이용해 컴포넌트를 리렌더링합니다.

2. Props 변경: 컴포넌트가 받는 props가 변경되면 해당 컴포넌트는 리렌더링됩니다. 이것은 부모 컴포넌트로부터 props를 받는 모든 자식 컴포넌트에 적용됩니다.

3. 부모 컴포넌트 리렌더링: 부모 컴포넌트가 리렌더링되면 그의 모든 자식 컴포넌트들도 리렌더링 됩니다. 부모 컴포넌트의 state나 props가 변경되면 부모 컴포넌트는 리렌더링되며, 이에 따라 모든 자식 컴포넌트들도 리렌더링 됩니다.

4. Context 변경: React Context API를 사용하면 컴포넌트 트리 내에서 전역적으로 데이터를 공유할 수 있습니다. Context에 변경이 생기면 그를 구독하는 모든 컴포넌트는 리렌더링됩니다.

5. Force Update: forceUpdate 메서드를 사용하면 컴포넌트는 강제로 리렌더링 될 수 있습니다. 이 방법은 가능한 한 피해야 합니다. 대부분의 경우 state나 props의 변경으로 리렌더링을 처리할 수 있기 때문입니다.

이러한 각 경우에 대해서는 컴포넌트가 실제로 변경되는지를 판단하기 위해 React는 '재조정(reconciliation)' 프로세스를 사용하여 가상 DOM과 실제 DOM을 비교합니다. 이로 인해 React는 필요한 부분만 업데이트하게 되어 효율성이 향상됩니다.