37장. View Transition을 Navigation 계약으로 만든다
전환은 예쁘게 보이는 것보다 어느 요소가 같은 의미를 이어가는지 설명해야 한다. 고유 transition name과 reduced-motion fallback을 두고 duplicate name을 피한다. 뒤로 가기, 중단된 navigation, loading/error, scroll와 focus를 포함한다. animation이 완료돼도 focus가 옛 route에 남으면 실패다.
LCP image와 긴 task에 주는 영향을 측정하고 저사양 기기에서 frame drop을 본다. prefers-reduced-motion: reduce에서는 의미 없는 이동을 제거한다. 전환 때문에 DOM을 복제해 screen reader가 중복 읽지 않게 한다. 지원하지 않는 browser에서도 즉시 정상 navigation이 되어야 한다.