Redux와 SWR 비교

#SWR은?

• = Stale While Revalidate
  • 백그라운드에서 캐시를 재검증(revalidate)하는 동안에 기존의 캐시 데이터(stale)를 사용하여 화면을 그려wnsek.
• data fetching 라이브러리이다.

#리덕스와 다른점

• 다음과 같은 세가지의 state가 있다.
  • Local State: 리액트 컴포넌트 안에서만 사용되는 state
  • Global State: Global Store에 정의되어 프로젝트 어디에서나 접근할 수 있는 state
  • Server State: 서버로부터 받아오는 state

1. 리덕스는 모든 state를 한번에 관리하는 형태이지만, SWR과 같은 data fetching 라이브러리를 사용하면 Global state와 Server state의 관심사를 분리시킨다.
2. 리덕스는 자체적으로 비동기 로직을 사용할 수 없어서 redux-thunk, redux-saga와 같은 것을 사용하게 되는데 이떄문에 코드가 복잡해지게 된다. SWR의 경우, 데이터를 언제 fetch하면 되는지만 기술하면 된다. 즉, 선언적 프로그래밍이 가능해져 코드가 복잡하지 않다.
3. 리덕스는 action이 추가될때마다, 각 action 타입마다 비슷한 코드를 반복적으로 작성하게 된다.

 

 

• 참고한 내용 : https://fe-developers.kakaoent.com/2022/220224-data-fetching-libs/

https://tecoble.techcourse.co.kr/post/2021-05-23-swr/