PageSpeed Insights (PSI)는 웹 개발자가 페이지의 성능과 성능을 개선하는 방법을 이해할 수 있는 도구입니다. Lighthouse를 사용하여 페이지를 감사하고 성능 개선 기회를 파악합니다. 또한 Chrome UX 보고서 (CrUX)와 통합되어 실제 사용자가 페이지와 출처를 어떻게 경험하는지 전체적으로 보여줍니다. 이 가이드에서는 PSI를 사용하여 CrUX에서 유용한 정보를 추출하고 사용자 경험을 더 잘 이해하는 방법을 알아봅니다.
데이터 읽기
시작하려면 https://pagespeed.web.dev/로 이동하세요. 테스트하려는 페이지의 URL을 입력하고 분석을 클릭합니다.
몇 초 후 Lighthouse에서 감사가 수행되며 CrUX('실제 사용자가 경험하는 문제 살펴보기') 및 Lighthouse('성능 문제 진단')의 데이터가 포함된 섹션이 표시됩니다. CrUX는 현장에서 얻은 실제 사용자 경험의 모음이고, Lighthouse는 실험실에서 통제되는 테스트입니다.
실제 사용자 환경 섹션에서는 측정항목이 코어 웹 바이탈 및 기타 주요 측정항목으로 그룹화됩니다. 세 가지 Core Web Vitals 측정항목인 최대 콘텐츠 페인트 (LCP), 다음 페인트에 대한 상호작용 (INP), 레이아웃 변경 횟수가 먼저 나열됩니다. 그다음에는 콘텐츠가 포함된 첫 페인트 (FCP) 및 첫 바이트까지의 시간 (TTFB)이라는 다른 주목할 만한 측정항목이 표시됩니다.
코어 웹 바이탈
- LCP는 페이지에 주요 콘텐츠(예: 히어로 이미지 또는 제목)가 표시될 때까지의 시간을 측정합니다.
- INP는 사용자가 페이지와 상호작용한 모든 상호작용의 지연 시간을 측정하여 페이지의 상호작용성을 측정하고, 모든 상호작용 또는 거의 모든 상호작용이 더 적은 단일 값을 보고합니다.
- CLS는 비동기식으로 로드된 콘텐츠가 삽입되는 등의 변경으로 인해 페이지의 레이아웃이 불안정한 정도를 측정합니다.
기타 주요 측정항목
- FCP는 페이지에 무언가가 표시될 때까지의 시간을 측정합니다. 텍스트나 로고처럼 전면에 배치될 수 있습니다.
- TTFB는 리소스에 대한 요청과 응답의 첫 번째 바이트가 도착하기 시작하는 시점 사이의 시간을 측정하는 실험용 측정항목입니다.
측정항목 기준
이 표에서는 이러한 측정항목의 값이 '좋음', '개선이 필요함', '나쁨'으로 표현됩니다.
| 측정항목 | 'Good' | '개선 필요' | '나쁨' |
|---|---|---|---|
| LCP | 0~2500밀리초 | 2500~4000ms | 4000밀리초 이상 |
| CLS | 0.00~0.10 | 0.10~0.25 | 0.25 이상 |
| INP | 0~200밀리초 | 200ms~500ms | 500밀리초 이상 |
| FCP | 0~1800밀리초 | 1800ms~3000ms | 3000밀리초 이상 |
| TTFB | 0~800밀리초 | 800ms~1,800ms | 1,800밀리초 이상 |
코어 웹 바이탈 측정항목은 가장 중요한 측정항목이며 실제 사용자가 직접 경험합니다. 다른 측정항목은 진단으로 사용할 수 있지만 실제 사용자가 인지할 필요는 없습니다. 따라서 이러한 측정항목은 Core Web Vitals 평가에 반영되지 않으며 '좋음'을 충족하지 못함 기준점은 Core Web Vitals에 부정적인 영향을 미치는 경우에만 중요합니다.
PSI에 사용자 환경이 표시되는 방법에는 세 가지가 있습니다.
- 코어 웹 바이탈을 통과했거나 통과하지 못한 것으로 페이지를 요약하는 라벨 평가
- 초 또는 밀리초 단위로 측정된 백분위수 (CLS는 단위가 없음)
- '좋음', '개선 필요', '나쁨'의 비율을 나타내는 분포입니다. 이 섹션의 오른쪽 상단에 있는 펼치기 보기를 클릭하면 볼 수 있습니다.
위의 스크린샷에서는 페이지에 '통과' 라벨이 지정되어 있습니다. Core Web Vitals 평가를 진행할 수 있습니다 통과하려면 백분위수가 '양호'로 분류되어야 합니다. 3가지 Core Web Vitals를 모두 포함합니다 그렇지 않으면 평가가 '실패'로 표시됩니다. 일부 페이지에는 INP 데이터가 충분하지 않을 수 있으며, 이 경우 페이지는 다른 두 가지 Core Web Vitals 측정항목으로 평가됩니다.
모든 측정항목에 표시된 백분위수는 75번째 백분위수에 해당합니다. 통계에서 백분위수는 샘플의 특정 비율이 해당 비율에 속하는 값을 나타내는 측정값입니다. 예를 들어 위의 스크린샷은 INP의 75번째 백분위수가 64ms임을 보여줍니다. 즉, INP 환경의 75% 가 64ms보다 빠릅니다. 이 값은 위의 임계값 표에 따라 색상으로 구분됩니다. 여기서 '양호'는 값은 녹색, 값은 '개선이 필요함'입니다. 주황색이며 '나쁨' 값은 빨간색입니다.
마지막으로 각 측정항목의 분포는 '좋음', '개선 필요', '나쁨'으로 표시됩니다. 그룹화할 수 있습니다. 예를 들어 이 페이지의 LCP 환경이 '양호'합니다. (2.5초 미만) 90% 확률로 사용할 수 있습니다. INP가 '나쁨'입니다. (최소 500밀리초) 1% 에 해당하는 시간 동안 실행됩니다. 이러한 분포는 페이지의 모든 사용자 경험을 나타내며 형태가 '좋음' 경향을 나타냅니다. '나쁨'으로 표현할 수 있습니다.
원본 실적 요약
PSI에는 원본 실적에 대한 요약도 포함됩니다. 출처의 모든 페이지에서 집계된 사용자 환경입니다. 전체 출처에 대해 개별 페이지에 사용할 수 있는 동일한 통계를 얻을 수 있습니다. 이 데이터는 BigQuery에서 제공되는 데이터와 밀접하게 일치하며, 페이지 수준 성능은 쿼리할 수 없습니다.
PSI의 출처 수준 데이터와 BigQuery에는 한 가지 주요 차이점이 있습니다. BigQuery의 데이터 세트는 한 달에 한 번 출시되며 전월의 데이터를 포함합니다. 예를 들어 202005 데이터 세트에는 2020년 5월에 발생한 모든 사용자 환경이 포함되어 있습니다. 반면 PSI는 이전 28일을 포함하여 매일 새로운 데이터를 집계합니다. 따라서 오늘 보는 결과는 내일 다를 수 있으며 BigQuery에서 이번 달 집계에 표시되는 결과와 반드시 동일하지는 않을 수 있습니다.
CrUX에서 URL 데이터를 사용할 수 없을 때의 응답
입력한 URL을 CrUX에서 사용할 수 없는 경우 PageSpeed Insights에서는 다음 스크린샷과 같이 출처 수준 데이터로 대체를 시도합니다. 사용 중지된 This URL 버튼 옆에 있는 아이콘을 클릭하면 자세한 설명이 표시됩니다.
CrUX에서도 출처 수준 데이터를 사용할 수 없는 경우 PSI에 이 섹션이 표시되지 않고 No Data(데이터 없음)가 표시됩니다. Lighthouse의 실습 데이터는 페이지 성능에 대한 근사치를 제공하기 위해 계속 사용할 수 있습니다.
FAQ
다음은 PageSpeed Insights의 CrUX 데이터에 관해 자주 묻는 질문(FAQ)입니다.
다른 도구와 달리 PageSpeed Insights는 어떤 경우에 사용하나요?
PSI는 CrUX의 실제 사용자 경험 데이터와 Lighthouse의 실험실 기반 성능 진단을 결합합니다. 이렇게 하면 페이지 사용 속도와 속도를 높이는 방법을 한곳에서 쉽게 확인할 수 있습니다. PSI에서 필드 데이터를 매일 집계하므로 집계 빈도가 낮은 도구보다 출처 또는 URL 성능을 더 면밀히 모니터링할 수 있습니다.
PageSpeed Insights를 사용할 때 제한사항이 있나요?
PSI는 가장 최근의 일일 집계만 제공하므로 사이트의 실적 동향을 확인할 수는 없습니다. CrUX 데이터 세트에는 PSI에 노출되지 않는 일부 중요하지 않은 측정항목도 있습니다.
PageSpeed Insights에 대한 자세한 내용은 어디에서 확인할 수 있나요?
PSI 문서 확인 를 참조하세요.