Community

React 18의 Suspense를 설명하는 글입니다. React를 잘하진 못해서 18 버전의 릴리스 노트를 보고도 다 이해는 못했었는데 이 글을 통해서 Suspense가 어떤 문제를 해결하고

React 18의 Suspense를 설명하는 글입니다. React를 잘하진 못해서 18 버전의 릴리스 노트를 보고도 다 이해는 못했었는데 이 글을 통해서 Suspense가 어떤 문제를 해결하고 어떻게 사용할 수 있는지 이해할 수 있었습니다. 기존에는 각 컴포넌트가 로딩 상태를 제어해야 했기에 사용자 경험을 개선하기 어려운 점도 있었고 컴포넌트가 마운트되었을 때 다운로드를 시작하기 때문에 결과적으로 느린 효과도 있었는데 Suspense를 사용하면 이를 한번에 처리할 수 있고 컴포넌트 마운트 이전에도 데이터 패칭을 시작할 수 있게 된다고 합니다. 또한 startTranstion()을 사용하면 화면 업데이트를 뒤로 미룰 수 있는데 이를 Suspsnse와 함께 사용하면 비동기로 페이지를 전환할 때 훨신 자연스럽게 구현할 수 있다고 합니다. 그리고 Suspense를 통해 React가 비동기 렌더링을 이해할 수 있게 되었기 때문에 서버사이드 랜데링에서도 Suspense Streaming SSR을 이용하면 Suspense 외부의 내용을 먼저 보내고 Suspense는 나중에 클라이언트에게 보내 줄 수 있게 됩니다. 각 상황 설명도 좋고 예제코드와 풀이를 함께 보여주고 있어서 이해하게 좋았습니다.

알림

알림이 없습니다