[React] Context API vs Redux

김지민·2022년 8월 12일
0

프로젝트에서 redux를 사용하고자 한다.
하지만 무작정 redux를 사용하는 것은 나와 맞지 않다.

redux를 왜 쓰는지
context api와 비교해서 알아보고자 한다.

참고글 👇
https://blog.isquaredsoftware.com/2021/01/context-redux-differences/

1. react context

react에서 prop 전달의 흐름은 하향식이다.
전달되는 prop가 많아지고 컴포넌트 깊이가 길어지면 관리가 번거러워 질 수 있다.

context tree를 통해서 하향식 전달 상태가 아닌 어디서든 상태값에 접근을 가능하도록 하여 상태관리의 번거로움으 줄일 수 잏다.

2. redux

애플리케이션의 상태를 예측 가능한 방식으로 업데이트 하기 위한 패턴 또는 라이버리이다.

redux를 통하면 상태가 언제, 어디서, 어떻게 업데이트 되었는지 쉽게 알 수 있다.

이는 redux devtools를 이용하여 앱의 작업 기록 및 상태확인이 가능하다.

3. redux를 사용하는 이유

리덕스와의 주요 차이는 성능 면에서 나타나게 됩니다. 리덕스에서는 컴포넌트에서 글로벌 상태의 특정 값을 의존하게 될 때 해당 값이 바뀔 때에만 리렌더링이 되도록 최적화가 되어있습니다. 따라서, 글로벌 상태 중 의존하지 않는 값이 바뀌게 될 때에는 컴포넌트에서 낭비 렌더링이 발생하지 않겠지요. 반면 Context에는 이러한 성능 최적화가 이뤄지지 않았습니다. 컴포넌트에서 만약 Context의 특정 값을 의존하는 경우, 해당 값 말고 다른 값이 변경 될 때에도 컴포넌트에서는 리렌더링이 발생하게 됩니다.

profile
💡Habit is a second nature. [Git] https://github.com/Kimjimin97

0개의 댓글