| 항목 | 설명 |
|---|---|
useDeferredValue / useTransition |
메인 스레드를 많이 쓰는 작업이 있을 때, 랜더링 중에도 다른 사용자 이벤트를 먼저 처리할 수 있게 함 |
| 한계 | 오래 걸리는 작업 자체가 빨라지지는 않음 |
| 예시 | AI 챗봇에서 마크다운/mermaid 등 복잡한 렌더링 컴포넌트 → useDeferredValue를 써도 렌더링은 여전히 버벅임 |
| 효과 | 버벅이는 중에도 정지 버튼 같은 이벤트는 눌릴 수 있음 |
| 추가 | 상황에 따라 debounce / throttle 적용 필요 |
SSR 렌더링 시 DB 호출 결과 캐싱 가능
개인정보처럼 사용자 고유 + 타인에 의해 변경되지 않는 데이터라면 캐싱하면 SSR임에도 CSR처럼 라우팅 속도 빠르게 동작함
캐시 무효화를 위해 revalidatePath 함께 써야 함
근데 TRPC 없이 unstable_cache + revalidatePath 두 개만 쓰면 코드 복잡도 올라가고, React Query의 장점인 선언적 데이터 fetching + 캐싱 관리 못 씀
그래서 TRPC (default value) + unstable_cache 조합 쓰는 게 더 나은 선택일 듯
이 방식으로 LCP 개선 효과 기대 가능