AI 요약관련 정보

• 기존 조건부 렌더링 방식은 컴포넌트를 완전히 제거하고 다시 추가하여 상태(state)가 초기화되는 문제가 있습니다. 🔄
• 새로운 Activity 컴포넌트는 mode="hidden" 또는 mode="visible"을 사용하여 컴포넌트의 상태를 유지하면서 조건부 렌더링을 가능하게 합니다. 💾
• Activity 컴포넌트가 hidden 모드일 때, useEffect와 같은 사이드 이펙트는 자동으로 일시 중지되거나 정리되어 불필요한 동작을 방지합니다. ⏸️
• Activity는 Suspense와 함께 사용하여 데이터를 미리 로드할 수 있습니다. hidden 상태일 때 React는 유휴 시간에 백그라운드에서 데이터를 미리 렌더링하여, 컴포넌트가 visible이 될 때 즉시 표시되도록 합니다. 🚀
• Next.js와 같은 SSR 환경에서 Activity는 컴포넌트의 하이드레이션 우선순위를 조절할 수 있습니다. 덜 중요한 부분을 Activity로 감싸면, 중요한 부분이 먼저 상호작용 가능하게 됩니다. ⚡
• 이러한 우선순위 조절은 블로그 게시물의 댓글 섹션처럼 중요도가 낮은 콘텐츠를 나중에 로드하여 사용자 경험을 향상시키는 데 유용합니다. 💬