📚 Reference

📜 Chapter

LCP (Largest Contentful Paint)

Speed Index

• Speed Index
• “화면이 얼마나 빨리 시각적으로 채워지는지”를 나타내는 성능 지표이다.
• 사용자가 페이지에 들어왔을 때 빈 화면에서 시작해서 주요 UI가 점점 보이는 속도를 점수화한 값이다.

Speed Index, LCP - 차이

• LCP는 “가장 큰 주요 콘텐츠 하나가 언제 보였는지”를 본다. 예를 들어 대시보드에서 큰 테이블이나 큰 카드가 1.8초에 보이면 LCP는 그 시점을 기준으로 잡는다.

• 반면 Speed Index는 페이지 전체가 시각적으로 얼마나 빠르게 채워졌는지를 본다.

• 예를 들어:

  0초: 빈 화면
  1초: 헤더 보임
  1.5초: 필터 영역 보임
  2초: 테이블 일부 보임
  3초: 전체 화면 완성
  

• 이런 과정을 보고 사용자가 체감하기에 화면이 빨리 뜨는지를 계산하는 지표이다.

Speed Index 점수별 평가 기준

• Speed Index는 보통 초 단위(ms) 로 나오고, 낮을수록 좋다.