Lighthouse의 전체 성능 점수 계산 방법
일반적으로 추천 또는 진단 결과가 아닌 metrics만 Lighthouse 성능 점수에 영향을 미칩니다. 즉, 기회와 진단을 개선하면 측정항목 값이 향상될 가능성이 높으므로 간접 관계가 있습니다.
아래에 점수가 변동될 수 있는 이유, 점수 구성 방식, Lighthouse에서 개별 측정항목의 점수를 매기는 방식이 요약되어 있습니다.
점수가 변동되는 이유
전반적인 성능 점수 및 측정항목 값의 다양한 변동은 Lighthouse로 인한 것이 아닙니다. 실적 점수가 변동하는 이유는 일반적으로 기본 조건의 변화 때문입니다. 일반적인 문제는 다음과 같습니다.
- A/B 테스트 또는 게재되는 광고의 변경사항
- 인터넷 트래픽 라우팅 변경사항
- 고성능 데스크톱 및 저성능 노트북과 같은 다양한 기기에서 테스트
- 자바스크립트를 삽입하고 네트워크 요청을 추가/수정하는 브라우저 확장 프로그램
- 바이러스 백신 소프트웨어
자세한 내용은 Lighthouse의 가변성 문서를 참고하세요.
또한 Lighthouse는 전체 성능 점수를 하나만 제공할 수 있지만 사이트 실적을 하나의 숫자가 아닌 점수의 분포로 생각하는 것이 더 유용할 수 있습니다. 그 이유를 알아보려면 사용자 중심 성능 측정항목 소개를 참조하세요.
실적 점수에 가중치가 부여되는 방식
실적 점수는 측정항목 점수의 가중치 평균입니다. 가중치가 높은 측정항목이 전체 실적 점수에 더 큰 영향을 미치는 것은 당연합니다. 측정항목 점수는 보고서에 표시되지 않지만 내부적으로 계산됩니다.
등대 10
| 감사 | 무게 |
|---|---|
| 콘텐츠가 포함된 첫 페인트 | 10% |
| 속도 색인 | 10% |
| 최대 콘텐츠 렌더링 시간 | 25% |
| 총 차단 시간 | 30% |
| 레이아웃 변경 횟수 | 25% |
등대 8
| 감사 | 무게 |
|---|---|
| 콘텐츠가 포함된 첫 페인트 | 10% |
| 속도 색인 | 10% |
| 최대 콘텐츠 렌더링 시간 | 25% |
| 상호작용 시작 시간 | 10% |
| 총 차단 시간 | 30% |
| 레이아웃 변경 횟수 | 15% |
측정항목 점수 산정 방식
Lighthouse가 성능 측정항목을 수집하면 (대부분 밀리초 단위로 보고됨) Lighthouse 점수 분포에서 측정항목 값이 속하는 위치를 확인하여 각 원시 측정항목 값을 0~100의 측정항목 점수로 변환합니다. 점수 분포는 HTTP 보관 파일에 대한 실제 웹사이트 성능 데이터의 성능 측정항목에서 파생된 로그 정규 분포입니다.
예를 들어 최대 콘텐츠 렌더링 시간 (LCP)은 사용자가 페이지에서 가장 큰 콘텐츠가 표시된다고 인식할 때 측정합니다. LCP의 측정항목 값은 사용자가 페이지 로드를 시작한 후 기본 콘텐츠를 렌더링하는 페이지가 렌더링될 때까지 걸리는 시간을 나타냅니다. 실제 웹사이트 데이터를 기반으로 최고 성능의 사이트는 약 1,220ms 내에 LCP를 렌더링하므로 측정항목 값은 점수 99로 매핑됩니다.
좀 더 자세히 살펴보면 Lighthouse 점수 곡선 모델은 HTTPArchive 데이터를 사용하여 두 제어점을 결정한 다음 로그 정규 곡선의 모양을 설정합니다. HTTPArchive 데이터의 25번째 백분위수는 점수 50점 (중앙값 기준점), 8번째 백분위수는 점수 90점 (양호/녹색 기준점)이 됩니다. 아래의 점수 곡선 도표를 살펴보면서 0.50~0.92 사이의 측정항목 값과 점수 사이에는 선형에 가까운 관계가 있음을 알 수 있습니다. 약 0.96점은 '수익 감소 지점'입니다. 이 곡선은 위로 멀어지므로 이미 높은 점수를 개선하려면 더 많은 측정항목 개선이 필요합니다.
데스크톱과 모바일의 처리 방식
위에서 언급했듯이 점수 곡선은 실제 실적 데이터를 바탕으로 결정됩니다. Lighthouse v6 이전에는 모든 점수 곡선이 모바일 성능 데이터를 기반으로 했지만 데스크톱 Lighthouse 실행에서는 이 데이터를 사용했습니다. 실제로는 데스크톱 점수가 인위적으로 부풀려졌습니다. Lighthouse v6에서는 특정 데스크톱 점수를 사용하여 이 버그를 수정했습니다. 물론 전반적인 실적 점수가 5에서 6으로 변경될 것으로 예상할 수 있지만 데스크톱에서는 점수에 차이가 있을 것입니다.
점수가 색상으로 구분되는 방식
측정항목 점수와 성능 점수는 다음 범위에 따라 색상이 지정됩니다.
- 0~49 (빨간색): 나쁨
- 50~89 (주황색): 개선 필요
- 90~100 (녹색): 좋음
우수한 사용자 환경을 제공하기 위해 사이트는 높은 점수 (90~100점)를 얻기 위해 노력해야 합니다. 100점의 '완벽한' 점수는 달성하기란 매우 어려운 일입니다. 예를 들어 99점에서 100점으로 점수를 매기려면 90점에서 94점까지 필요한 것과 거의 동일한 수준의 측정항목 개선이 필요합니다.
개발자가 성능 점수를 개선하기 위해 무엇을 할 수 있을까요?
먼저 Lighthouse 점수 계산기를 사용하여 특정 Lighthouse 성능 점수를 달성하기 위해 목표로 해야 하는 기준점을 파악합니다.
Lighthouse 보고서의 추천 섹션에는 이를 구현하는 방법에 관한 자세한 제안과 문서가 있습니다. 또한 진단 섹션에는 개발자가 성능을 더욱 개선하기 위해 살펴볼 수 있는 추가 안내가 나와 있습니다.