그렇다면 앞에서 배운 Thunk와 Saga는 어떤 차이가 있을까요?
지금부터는 Thunk와 Saga를 한 번 비교해보고 어떤 방식을 사용하는 것이 좋을지 살펴보도록 하겠습니다.
먼저 두 가지 방법 모두 Redux에서 비동기 로직을 포함한 Side Effects를 사용할 수 있게 해준다는 점에서는 동일합니다.
그래서 Redux에서 Side Effects를 사용하고 싶다면 Thunk나 Saga 둘 중에서 선택을 해서 사용하면 됩니다.
그렇다면 둘 중에서 어떤걸 선택해야 할까요?
이 표는 Thunk와 Saga를 여러가지 관점에서 비교해본 것입니다.
먼저 Async Logic 처리 방식과 관련해서는 Thunk는 Promise
를 사용하고 Saga는 Generator
를 사용합니다.
그리고 사용 난이도 측면에서는 Thunk는 대부분의 개발자들에게 익숙한 Promise
를 사용하기 때문에 상대적으로 쉬우며, Saga는 Generator
에 대해 추가로 학습이 필요하기 때문에 어렵다고 볼 수 있습니다.
그리고 작성해야 하는 코드의 양은 Thunk가 Saga에 비해서 적은 편입니다.
마지막으로 복잡한 Async Logic을 구현하는 측면에서는 Thunk는 구현하기 어렵고 Saga는 쉽게 구현이 가능합니다.
Saga에는 다양한 Effect Creator들이 존재하기 때문에 그것들을 잘 조합해서 사용하면 복잡한 형태의 Async Logic도 쉽게 구현할 수 있습니다.
자, 그렇다면 이렇게 Thunk와 Saga를 비교해보았는데, Redux에서 Side Effects를 사용하기 위해서 둘 중에 어떤 것을 사용하는게 좋을까요?
사실, 정답은 없습니다.
규모 ⬆︎, 복잡한 Async Logic ✅ → Saga
규모 ⬇︎, 복잡한 Async Logic ❌ → Thunk
개발자가 각 프로젝트의 상황에 맞게 결정해서 사용하면 되는데, 일반적으로 규모가 크고 복잡한 Async Logic이 있는 애플리케이션의 경우 Saga를 사용하고, 규모가 작고 복잡한 Async Logic이 없는 애플리케이션의 경우 Thunk를 사용합니다.
이 점을 참고해서 각자 개발하려는 애플리케이션에 맞게 선택해서 사용하면 됩니다.
마지막 업데이트: 2023년 07월 14일 00시 00분
이 문서의 저작권은 이인제(소플)에 있습니다. 무단 전재와 무단 복제를 금합니다.