PageSpeed 점수의 진실 — 측정할 때 알아야 할 것들

PageSpeed Insights에서 점수를 측정하고, 새로고침하면 점수가 달라집니다. 어제 88점이었는데 오늘 85점. 뭘 바꾼 것도 없는데. 이건 정상입니다.

PageSpeed 점수를 올리기 전에, 점수가 어떻게 계산되고 왜 변동하는지 이해해야 합니다. 그래야 의미 있는 최적화와 의미 없는 집착을 구분할 수 있습니다.

1같은 사이트, 다른 점수

같은 사이트를 연속으로 3번 측정하면 이런 결과가 나옵니다:

코드를 한 줄도 바꾸지 않았는데 87점과 88점이 왔다갔다합니다. 이건 Lighthouse의 특성입니다.

2Mobile vs Desktop 차이

많은 사람들이 "Desktop은 97점인데 Mobile은 왜 88점이지?"라고 합니다. 같은 사이트인데 왜 10점 이상 차이가 날까요?

Mobile 테스트는 CPU를 4배 느리게, 네트워크를 4G로 제한합니다. 실제 최신 스마트폰보다 훨씬 느린 환경입니다. Moto G Power는 2019년 출시된 보급형 기기입니다.

3Lighthouse 점수 가중치

PageSpeed Performance 점수는 5가지 지표의 가중 평균입니다. 각 지표가 점수에 얼마나 기여하는지 알아야 어디를 최적화할지 판단할 수 있습니다.

490점과 100점의 차이

PageSpeed 최적화는 점수가 올라갈수록 투자 대비 효과가 급감합니다.

38점에서 88점까지 올리는 데 4단계(이미지, CLS, 폰트, LCP)로 충분했습니다. 하지만 88점에서 95점으로 올리려면 JavaScript 런타임 크기, 서드파티 스크립트, 서버 응답 시간 같은 근본적으로 제어하기 어려운 영역을 건드려야 합니다.

5점수보다 중요한 것

PageSpeed 점수는 실험실 데이터(Lab Data)입니다. 실제 사용자 경험은 필드 데이터(Field Data)로 확인해야 합니다.

Google 검색 랭킹에 영향을 주는 건 Lab Data 점수가 아니라 Field Data의 Core Web Vitals입니다. PageSpeed 상단에 표시되는 "이 URL의 실제 사용자 환경 데이터"가 바로 Field Data입니다.

6측정 자동화

수동으로 매번 pagespeed.web.dev에 접속하는 건 번거롭습니다. PageSpeed Insights API를 사용하면 자동으로 측정하고 기록할 수 있습니다. 구체적인 구현은 API 자동화 글을 참고하세요.

# PageSpeed Insights API 호출 (무료)
# Google Cloud Console에서 API 키 발급 필요

curl "https://www.googleapis.com/pagespeedonline/v5/runPagespeed\
?url=https://example.com\
&strategy=mobile\
&key=YOUR_API_KEY"

# 응답에서 주요 지표 추출
# .lighthouseResult.categories.performance.score  → 점수
# .lighthouseResult.audits.largest-contentful-paint → LCP
# .lighthouseResult.audits.cumulative-layout-shift  → CLS
# .lighthouseResult.audits.total-blocking-time      → TBT

이걸 cron job이나 CI/CD 파이프라인에 넣으면 배포 후 자동으로 성능을 체크할 수 있습니다. 점수가 일정 기준 이하로 떨어지면 알림을 보내는 것도 가능합니다.