FID에서 INP로, 웹 반응성 측정의 패러다임 전환

Context

First Input Delay(FID)는 첫 상호작용 지연만 측정하는 구조적 한계 존재. 첫 클릭 이후 발생하는 성능 저하나 렌더링 지연을 감지하지 못하는 맹점 발생. 실제 사용자 경험과 측정 지표 사이의 괴리 심화.

Technical Solution

• 모든 상호작용의 전체 생명주기를 측정하는 Interaction to Next Paint(INP) 지표 도입
• Input Delay, Processing Time, Presentation Delay 세 단계로 구분하여 지연 원인 정밀 분석
• 50ms 초과 Long Task 분리를 위해 scheduler.yield() 및 setTimeout(0) 기반의 메인 스레드 제어 전략 적용
• React.memo와 useMemo를 통한 불필요한 리렌더링 방지 및 useTransition 기반의 비긴급 업데이트 우선순위 조정
• forced layout을 유발하는 동기적 레이아웃 계산 로직 제거로 브라우저 렌더링 파이프라인 최적화
• web-vitals 라이브러리와 Chrome DevTools Interactions 트랙을 결합한 실사용자 기반 모니터링 체계 구축

Impact

• FID 통과 기준: 100ms 미만 (웹사이트 90% 이상 통과로 변별력 상실)
• INP 평가 기준: Good 200ms 이하, Needs Improvement 200-500ms, Poor 500ms 초과
• 측정 범위: 98th percentile 상호작용 값을 기준으로 최악의 사용자 경험 반영

Key Takeaway

웹 최적화의 관점을 초기 로딩 속도에서 세션 전체의 지속적인 응답성 유지로 확장해야 함. 메인 스레드 점유 시간을 최소화하는 비동기 처리 설계가 현대 웹 애플리케이션의 핵심 품질 지표임.