AI 시대의 웹 성능 엔지니어링 (Korean Edition)

제2장. 중요한 것을측정하기 : 사용자 중심 성능을 위한 핵심 지표

이 작품은 AI를 사용하여 번역되었습니다. 여러분의 피드백과 의견을 환영합니다: [e-mail]

2020년, Google은 웹 성능을 모두가 주목해야 할 몇 가지 핵심 지표로 압축하는 획기적인 노력을 선보였습니다: 핵심 웹 바이탈(Core Web Vitals, CWVs). 이 장에서는 각 CWV를 심층적으로 살펴보고 그 중요성을 설명합니다. 이 작업에 참여한 사람으로서, 이러한 지표를 정의한 배경과 특정 목표를 설정한 근거에 대한 내부적 관점을 제공합니다.

이 장은 각 지표를 차례로 논의하는 방식으로 구성됩니다. 측정 대상, 해석 방법, 권장 목표치(양호, 개선 필요, 불량 범주)를 포함합니다. 중요한 점은 각 지표를 대표하는 UX 결과와 연결하고 그 중요성을 입증하는 연구("웹 바이탈의 과학적 근거")를 제시한다는 것입니다. 본 장은 핵심 지표에 대한 기본적인 개요를 제공하지만 세부적인 내용은 다루지 않습니다. 이러한 지표 최적화에 대한 구체적인 내용은 6장을 참조하십시오.

초기 세 가지 CWV는 LCP(최대 콘텐츠 페인트), FID(첫 입력 지연), CLS(누적 레이아웃 이동)였습니다. 이후 FID는 INP(다음 페인트까지의 상호작용)로 대체되었습니다. 각 지표는 페이지 경험의 한 측면, 즉 로딩 속도, 상호작용성, 시각적 안정성을 각각 다룹니다.

실험실 테스트와 현장 측정

에는 두 가지 기본 접근 방식이 있습니다: 실험실 데이터(합성 테스트)와 현장 데이터(실제 사용자 데이터)입니다. 둘 다 가치가 있으며 서로를 보완합니다.

실험실 테스트는 통제된 환경에서 사이트 성능을 테스트하는 것입니다. 예를 들어, 다양한 기기와 네트워크를 시뮬레이션할 수 있는 Lighthouse( “실험실 도구” 참조)와 같은 도구를 통해 실행하는 것이죠. 실험실 테스트는 실제 환경의 변동성을 제거하므로 재현성과 디버깅에 탁월합니다. 사이트에 Lighthouse 감사를 실행하면 일관된 성능 점수와 지표를 얻을 수 있습니다. 개발 과정에서 실험실 테스트를 활용하면 문제를 조기에 발견하고 개선을 위한 기준점을 설정하는 데 효과적입니다.

현장 모니터링은 실제 사용자가 환경에서 사용하는 데이터를 수집하는 것입니다. Chrome 사용자 경험 보고서(CrUX) 는 실제 Chrome 사용자의 사이트 이용 성능 통계를 집계한 공개 데이터셋입니다. PageSpeed Insights나 BigQuery 같은 도구로 접근할 수 있습니다. CrUX는 사이트 사용자에 대한 LCP, INP, CLS의 월별 집계 통계를 제공합니다(트래픽이 충분한 경우). 이는 현재 위치를 벤치마킹하는 데 유용합니다. 예를 들어, 사용자의 50%만이 좋은 LCP를 경험한다면 절반의 사용자가 평균 이하의 경험을 하고 있다는 뜻이며, 이는 개선 동기가 됩니다.

를 통해 웹 바이탈 JavaScript 라이브러리 (본 장 후반부에서 다룸)나 다른 실제 사용자 모니터링(RUM) 솔루션을 활용해 실제 방문자의 ...