# INP(Interaction to Next Paint)를 최적화 하기

> Clean Markdown view of GeekNews topic #8054. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=8054](https://news.hada.io/topic?id=8054)
- GeekNews Markdown: [https://news.hada.io/topic/8054.md](https://news.hada.io/topic/8054.md)
- Type: news
- Author: [xguru](https://news.hada.io/@xguru)
- Published: 2022-12-17T10:22:01+09:00
- Updated: 2022-12-17T10:22:01+09:00
- Original source: [web.dev](https://web.dev/optimize-inp/)
- Points: 6
- Comments: 0

## Topic Body

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

## Comments



_No public comments on this page._