PageSpeed Insights에서 Chrome UX 보고서 활용하기

PageSpeed Insights (PSI)는 웹 개발자가 페이지 성능 및 개선 방법을 이해할 수 있게 해주는 도구입니다. 또한 Lighthouse를 사용하여 페이지를 감사하고 성능 개선 기회를 식별합니다. 또한 Chrome UX 보고서 (CrUX)와 통합되어 실제 사용자가 페이지와 출처를 종합적으로 경험하는 방식을 보여줍니다. 이 가이드에서는 PSI를 사용하여 CrUX에서 유용한 정보를 추출하고 사용자 환경을 더 잘 이해하는 방법을 알아봅니다.

PageSpeed Insights의 CrUX 필드 데이터

데이터 읽기

시작하려면 https://pagespeed.web.dev/로 이동하여 테스트할 페이지의 URL을 입력하고 분석을 클릭합니다.

PageSpeed Insights를 시작하려면 URL을 입력하세요.

몇 초 후 Lighthouse 감사가 수행되고 CrUX ('실제 사용자가 경험하는 내용 살펴보기') 및 Lighthouse ('성능 문제 진단')의 데이터가 포함된 섹션이 표시됩니다. CrUX는 현장의 실제 사용자 경험 모음이고 Lighthouse는 실험실의 통제된 테스트입니다.

PageSpeed Insights의 CrUX 필드 데이터

실제 사용자 환경 섹션에서는 측정항목이 코어 웹 바이탈기타 주요 측정항목을 기준으로 그룹화됩니다. 세 가지 코어 웹 바이탈 측정항목이 먼저 나열됩니다. 최대 콘텐츠 렌더링 시간 (LCP), 최초 입력 반응 시간 (FID), 레이아웃 변경 횟수입니다. 그 뒤에는 콘텐츠가 포함된 첫 페인트 (FCP), 다음 페인트에 대한 상호작용 (INP), 첫 바이트까지의 시간 (TTFB)과 같은 다른 주목할 만한 측정항목이 이어집니다.

코어 웹 바이탈

  • LCP는 페이지에 주요 콘텐츠(예: 히어로 이미지 또는 제목)가 표시될 때까지의 시간을 측정합니다.
  • INP는 사용자와 페이지의 모든 상호작용의 지연 시간을 측정하고 모든 상호작용 (또는 거의 모든) 상호작용이 미미한 단일 값을 보고합니다.
  • CLS는 비동기식으로 로드된 콘텐츠가 삽입되는 등의 변화로 인해 페이지에서 레이아웃의 불안정성 정도를 측정합니다.

기타 주요 측정항목

  • FCP는 페이지에 텍스트나 로고와 같은 항목이 포그라운드에 표시될 때까지의 시간을 측정합니다.
  • TTFB는 리소스 요청과 응답의 첫 번째 바이트가 도착하기 시작하는 시점 사이의 시간을 측정하는 실험용 측정항목입니다.
  • 이제 지원 중단되고 INP로 대체FID는 사용자의 첫 번째 상호작용부터 페이지가 응답하는 시점까지 페이지의 상호작용을 측정합니다.

측정항목 기준점

다음 표에서는 이러한 측정항목의 값이 '좋음', '개선이 필요함' 또는 '나쁨'으로 분류되는 방식을 설명합니다.

측정항목 | '좋음' | '개선 필요' | '느림' -- | -- | -- | -- LCP | 0~2500ms | 4,000ms+ CLS | 0.00-0.10 | 0.10–0.25 | 0ms | 0.25ms | 0.10ms | 0ms | 0ms | 0ms | 0ms | 0ms | 5ms | 0ms | 0ms | 5ms | 0ms + 0ms | 5ms |

코어 웹 바이탈 측정항목은 가장 중요한 측정항목이며 실제 사용자가 직접 경험합니다. 다른 측정항목은 진단에 사용될 수 있지만 실제 사용자가 반드시 인지할 수 있는 것은 아닙니다. 따라서 이러한 측정항목은 코어 웹 바이탈 평가에 포함되지 않으며 '양호' 기준점을 충족하지 못하면 코어 웹 바이탈에 악영향을 미치는 경우에만 문제가 됩니다.

PSI에 사용자 환경이 표시되는 방법에는 세 가지가 있습니다.

  • 페이지가 코어 웹 바이탈 평가를 통과했는지 여부를 요약하는 라벨
  • 초 또는 밀리초 단위로 측정된 백분위수 (CLS는 단위가 없음)
  • 이 섹션의 오른쪽 상단에서 보기 펼치기를 클릭하면 '좋음', '개선이 필요함', '나쁨' 경험의 비율을 나타내는 분포가 표시됩니다.

PageSpeed Insights의 CrUX 데이터 확장 보기

위 스크린샷에서 페이지는 코어 웹 바이탈 평가 '통과'로 표시되어 있습니다. 통과하려면 백분위수가 세 가지 코어 웹 바이탈 모두에서 '양호'로 분류되어야 합니다. 그렇지 않으면 평가가 '실패'로 표시됩니다. 일부 페이지에 INP 데이터가 충분하지 않을 수 있으며, 이 경우 페이지가 다른 두 가지 Core Web Vitals 측정항목으로 평가됩니다.

모든 측정항목에 표시되는 백분위수는 75번째 백분위수에 해당합니다. 통계에서 백분위수는 특정 비율의 샘플이 해당 값 미만에 속하는지를 나타내는 척도입니다. 예를 들어 위 스크린샷은 FID의 75번째 백분위수가 13ms임을 보여줍니다. 즉, FID 환경의 75% 가 13ms보다 빠른 것입니다. 이러한 값은 위의 임계값 표에 따라 색상으로 구분됩니다. 여기서 '좋음' 값은 녹색, '개선이 필요함' 값은 주황색, '나쁨' 값은 빨간색입니다.

마지막으로 각 측정항목의 분포는 '좋음', '개선이 필요함', '나쁨' 그룹을 사용하여 설명합니다. 예를 들어 이 페이지의 LCP 환경은 90% 의 확률로 '양호' (2.5초 미만)됩니다. FID가 1% '느림' (300밀리초 이상)입니다. 이러한 분포는 페이지에서의 모든 사용자 경험을 나타내며, 그 모양은 '좋음' 또는 '나쁨' 경향을 나타냅니다.

원본 성능 요약

PSI에는 원본 성과에 대한 요약도 포함되어 있습니다. 출처에 있는 모든 페이지의 사용자 경험을 집계한 값입니다. 전체 출처에 대해 개별 페이지에서 사용할 수 있는 동일한 통계를 확인할 수 있습니다. 이 데이터는 BigQuery에서 사용할 수 있는 데이터와 거의 일치하지만 페이지 수준의 성능은 쿼리할 수 없습니다.

PageSpeed Insights의 원본 CrUX 성능

PSI의 원본 수준 데이터와 BigQuery의 원본 수준 데이터에는 한 가지 주요 차이점이 있습니다. BigQuery의 데이터 세트는 한 달에 한 번 출시되며 이전 달의 데이터를 포함합니다. 예를 들어 202005 데이터 세트에는 2020년 5월에 발생한 모든 사용자 환경이 포함됩니다. 반면 PSI에서는 이전 28일을 포함한 새로운 데이터를 매일 집계합니다. 따라서 오늘 보는 결과는 내일은 다를 수 있으며 BigQuery에서 이번 달 집계에 표시되는 결과와 다를 수 있습니다.

CrUX에서 URL 데이터를 사용할 수 없는 경우 응답

입력한 URL을 CrUX에서 사용할 수 없는 경우, PageSpeed Insights에서는 아래와 같이 출처 수준 데이터로 대체를 시도합니다. 사용 중지된 이 URL 버튼 옆의 아이콘을 클릭하면 자세한 설명이 표시됩니다.

PageSpeed Insights에 URL 수준 CrUX 데이터가 없어 원본 데이터가 표시됨

원본 수준 데이터를 CrUX에서도 사용할 수 없는 경우 PSI에서 이 섹션을 표시할 수 없으며 데이터 없음이 표시됩니다. Lighthouse의 실습 데이터는 페이지 성능에 대한 근사치를 제공하는 데 계속 사용할 수 있습니다.

PageSpeed Insights에 CrUX 데이터가 없음

FAQ

다른 도구와 달리 PageSpeed Insights는 어떤 경우에 사용하나요?

PSI는 CrUX의 실제 사용자 환경 데이터와 Lighthouse의 실험실 기반 성능 진단을 결합합니다. 이를 통해 페이지 로드 속도 및 페이지 속도를 빠르게 하는 방법을 한곳에서 쉽게 확인할 수 있습니다. PSI에서 일일 필드 데이터를 집계하면 집계 빈도가 낮은 도구보다 출처 또는 URL 성능을 더 면밀히 모니터링할 수 있습니다.

PageSpeed Insights 사용에 제한사항이 있나요?

PSI는 최신 일일 집계만 제공하므로 사이트의 실적 추이를 반드시 확인할 수 있는 것은 아닙니다. CrUX 데이터 세트에는 PSI에 노출되지 않은 일부 비핵심 측정항목도 포함되어 있습니다.

PageSpeed Insights에 대한 자세한 내용은 어디에서 확인할 수 있나요?

자세한 내용은 PSI 문서를 참고하세요.