SWC transform
compiler.styledComponents: true로 SSR class 변환을 활성화합니다.
styled-components 서버 스타일 수집 경로
App Router에서는 SWC 변환과 Client Registry가 각자 맡는 책임을 구분해야 첫 화면과 hydration이 일치합니다.
Render & collect
Client Registry의 ServerStyleSheet가 요청별 규칙을 모읍니다.
Insert & clear
useServerInsertedHTML로 style을 먼저 넣고 보낸 규칙을 비웁니다.
Hydration
클라이언트가 서버 태그를 재사용해 같은 규칙을 중복 생성하지 않습니다.
동적 스타일 갱신
상태와 테마 변화로 생기는 런타임 규칙만 클라이언트에서 추가합니다.
핵심새로고침 첫 화면의 스타일 깜박임, 중복 style 태그, hydration 경고를 함께 확인해야 수집 경로가 완성됩니다.