글또 10기 - Suspense가 뭐길래 useSuspenseQuery까지 나옴?

• Suspense는 React에서 비동기 작업을 보다 직관적이고 간단하게 처리하기 위한 기능으로, 로딩 상태를 컴포넌트 수준에서 간결하게 관리할 수 있도록 돕습니다. 기존의 복잡한 로딩 상태 관리 방식과 달리, Suspense는 fallback 컴포넌트를 통해 로딩 상태를 처리합니다.

• React 18에서 정식 기능으로 도입된 Suspense는 비동기 처리에 대한 선언적 기능을 제공하여, useEffect나 try..catch와 같은 복잡한 비동기 데이터 처리 로직을 단순화하고 관리하기 쉽게 만듭니다.

• React 18 이상 버전에서 Suspense와 ErrorBoundary를 사용하여 비동기 데이터의 로딩과 에러 처리를 선언적으로 처리할 수 있으며, 이를 통해 사용자 경험을 개선할 수 있다.

• Suspense 도입 시 기존 코드베이스에 React 버전 업그레이드, ErrorBoundary 설정, 적절한 fallback UI 구성, 성능 최적화 등의 변경 작업이 필요하며, 이러한 과정을 통해 현대적인 비동기 처리 방식을 이해하고 적용할 수 있다.