Core Web Vitals의 핵심 지표인 INP(Interaction to Next Paint)는 사용자의 모든 클릭 및 탭 상호작용 반응성을 측정합니다. 일회성 측정에 그치지 않고 세션 전반에 걸친 지속적인 메인 스레드 관리가 요구됩니다.

긴 작업(Long Tasks) 분할 및 메인 스레드 확보

50ms를 초과하는 긴 작업은 브라우저 렌더링을 차단합니다. scheduler.yield() API를 활용해 복잡한 자바스크립트 로직을 미세 단위로 분할하여 사용자 입력 처리를 최우선으로 보장해야 합니다.

레이아웃 스래싱 방지 및 CSS 렌더링 최적화

DOM 트리 깊이를 축소하고 content-visibility: auto를 적용하면 브라우저의 렌더링 부담이 획기적으로 줄어들어 탁월한 INP 수치를 달성할 수 있습니다.