[React] 전역 상태관리1(Prop Drilling, 전역상태 관리의 필요성)

전역 상태관리의 장점

1. Props Drilling이란?

Props Drilling은 React 컴포넌트에서 하위 컴포넌트로 계속해서 props를 전달하는 과정에서 발생하는 문제다. 부모 컴포넌트에서 자식 컴포넌트로 props를 하나씩 전달하게 되면, 중간에 있는 컴포넌트들까지 해당 props를 계속 전달해야 하는 번거로운 상황이 발생할 수 있다. 이 방식이 계속 이어지면, 컴포넌트 계층이 깊어질수록 코드가 복잡하고 유지보수가 어려워진다.

위 그림처럼 Child17과 Child19가 같은 상태를 사용하려면, Child1에서 상태를 만들고 내려줘야되고, Child6과 Child22에서 같은 상태를 사용하려면 최상위 App컴포넌트에서 상태를 만들어 내려줘야한다. 중간에 있는 컴포넌트들은 필요없는 상태가 오직 내려주기위해 전달하고 전달받아야되며 상태가 복잡하게 얽혀 props drilling이 발생한다. 이런 방식은 컴포넌트가 많을수록 비효율적이고 코드가 장황해진다.

2. 전역 상태 관리의 필요성

전역 상태 관리는 애플리케이션의 어떤 컴포넌트에서든 상태를 손쉽게 접근하고 수정할 수 있도록 도와준다. React에서는 props를 통한 상태 전달 방식 외에도, 전역 상태 관리를 사용하여 상태를 보다 효율적으로 관리할 수 있다.

• 컴포넌트 간의 데이터 공유가 필요할 때: 여러 컴포넌트가 같은 상태를 필요로 할 때, props를 계속 전달하는 대신 상태를 중앙에서 관리할 수 있다.
• 상태를 일관되게 유지하고 싶을 때: 여러 컴포넌트가 같은 상태를 공유하고 있을 때, 하나의 상태만 관리하면 전체 애플리케이션의 일관성을 유지할 수 있다.
• 복잡한 애플리케이션에서는 유용: 컴포넌트 계층이 깊고 상태가 많이 얽혀 있는 경우, 전역 상태 관리가 효율적이다.