2025-02-03 LightHouse 툴을 이용한 페이지 검사

LightHouse 툴을 사용하여 웹 페이지의 성능을 검사한 결과와 그 결과에 나타난 주요 지표들에 대해 정리합니다.

주요 지표 (Metrics)

• FCP (First Contentful Paint)
  페이지가 로드될 때 브라우저가 DOM 콘텐츠의 첫 번째 부분을 렌더링하는데 걸리는(사용자가 페이지 첫 부분을 볼 수 있는) 시간에 관한 지표

• SI (Speed Index)
  페이지 로딩 동안 콘텐츠가 시각적으로 표시되는 속도(얼마나 빨리 표시되는지)를 나타내는 지표

• LCP (Largest Contentful Paint)
  페이지의 주요 콘텐츠(가장 큰 이미지나 텍스트 블록)가 렏너링되기까지 거리는 시간을 나타내는 지표

• TTI (Time to Interactive)
  페이지가 완전히 인터랙티브해지는(사용자가 페이지와 상호작용할 수 있는)시점까지 걸리는 시간을 측정한 지표

• TBT (Total Blocking Time)
  페이지가 클릭, 키보드 입력 등의 사용자 입력에 응답하지 않도록 차단된 시간(FCP와 TTI 사이에 발생한 시간)을 총합한 지표

• CLS (Cumulative Layout Shift)
  페이지 로딩 중에 발생하는 예기치 못한 레이아웃 이동(화면상 요소의 우치나 크기가 순간적으로 변함)을 측정한 지표

추가 항목

• Opportunities (개선 사항 제안)
  페이지를 더욱 빨리 로드하는데 잠재적으로 도움 되는 제안

• Diagnostics (진단 정보)
  페이지의 성능에 영향을 미치는 다양한 진단 정보 제공

정리

Lighthouse는 위와 같은 지표들을 기반으로 웹 페이지의 성능 및 사용자 경험을 평가합니다.

• FCP, LCP, TTI, TBT, CLS 등의 핵심 지표를 통해 실제 사용자 관점에서 로딩 속도와 인터랙션 품질을 측정합니다.
• Opportunities와 Diagnostics를 통해 구체적인 최적화 방향을 제시합니다.