INP(Interaction to Next Paint)를 최적화 하기
(web.dev)- UI에서 페이지의 전체 반응성을 평가하는 실험적인 지표
- 모든 클릭, 탭 및 키보드 상호작용의 레이턴시를 관찰
- 최종 INP값은 가장 긴 인터랙션(아웃라이어 무시)
- 좋은 사용자 경험을 주려면, 웹사이트의 INP값은 200ms 이하여야함. 200~500ms는 개선 필요, 500ms 이상은 반응성이 느린 것
최적화 방법(제목만)
- INP에 나쁜 영향을 주는 것 찾아내기
- 필드 데이터에서 느린 인터랙션들 찾기
- 크롬 개발자 도구에서 느린 인터랙션 재현하기
- 필드 데이터가 없다면 ?
- 긴 입력 지연(Long Input Delay)를 진단하고 처리하기
- 입력 지연 식별법
- 긴 입력 지연 고치는 법
- 이벤트 콜백 최적화
- 프리젠테이션 지연 최소화
- 인터랙션이 겹칠 때
- INP 개선을 위해서는 끈기가 필요함