CWV(Core Web Vitals)에 맞게 웹 사이트를 최적화한 적이 있습니까? 다음 날 변경 사항을 확인하고 싶었지만 Google의 다양한 도구가 28일 기간으로 인해 현재 일일 CWV 측정항목을 제공하지 않습니까?

이 게시물에서는 CWV 측정을 위한 Google의 도구 집합을 검토하고 변경 사항이 Google Analytics(GA)를 사용하여 CWV에 매일 영향을 미치는지 확인하는 방법을 설명합니다.

정확한 일일 CWV 측정: 보고서 만들기

즉시 사용 가능한 모든 분석 서비스에는 일일 정확한 보고서에 대한 사전 빌드된 보기가 없습니다. 그렇기 때문에 다음 세 단계로 자체 보고서를 작성해야 합니다.

web-vitals : 프런트엔드에서 CWV 메트릭을 측정하기 위해

CWV GA tracking snippet : 이러한 캡처된 지표를 GA로 전송

Web Vitals Report : GA를 이 외부 보고 도구와 연결하여 CWV 보고서를 생성합니다

.

웹 바이탈 라이브러리를 사용하면 사이트의 각 방문자에 대한 모든 CWV 메트릭을 얻을 수 있습니다. 그런 다음 이러한 측정항목은 Google 애널리틱스로 전송됩니다. 그러면 외부 성능 보고서 도구가 GA 계정에서 이러한 추적 이벤트를 추출하고 매일 정확한 보고서를 생성할 수 있습니다.

속지 마십시오. GA는 이러한 이벤트를 검색할 때 CLS, LCP 및 기타 CWV 메트릭을 표시할 수 있습니다. 그러나 GA 이벤트 보기에서는 정확하지 않습니다. 예를 들어 각각 총 CLS에 누적되는 자체 델타 값이 있는 여러 CLS 이벤트가 전송될 수 있습니다. 정확한 보고를 받으려면 해당 날짜, URL 및 사용자별로 그룹화해야 합니다. 이 그룹화는 기본적으로 지원되지 않습니다.

이것이 Google이 외부 도구인 Web Vitals Report를 만든 이유입니다. GA 계정을 연결하면 데이터가 추출됩니다. CWV GA 추적 스니펫 내부의 기본 이름을 따랐다면 모든 것이 즉시 작동할 것입니다. 반짝이는 그래프와 전체적으로 정확한* 보고서를 받을 수 있습니다.

*) 샘플링 및 부정확한 보고서로 이어질 수 있는 각 보고서의 GAimposes a limit.



위의 스크린샷은 매일 정확한 Core Web Vital 지표가 포함된 Web Vitals 보고서에서 발췌한 것입니다.

부정확한 일일 CWV 측정: Google 도구

일일 CWV 측정의 경우 Google의 도구는 28일의 긴 기간 동안 집계하거나 실제 사용자 통계(RUM)가 아닌 합성으로 단일 페이지만 측정하기 때문에 신뢰할 수 없습니다. 따라서 해당 기간 내에 변경 사항을 확인하는 데 많은 날이 걸립니다.

그래도 Google은 다음에 최적화할 위치를 계획하기 위해 CWV 메트릭에 대한 훌륭하고 매우 쉬운 개요를 제공합니다. 그러나 이러한 도구로는 최적화가 CWV에 미치는 영향을 확인할 수 없습니다. 다음날.

현장 데이터 일명 실제 사용자 경험:

Google Search Console : 유사한 페이지 측정

PageSpeed Insights : 단일 페이지 및 모든 페이지를 전체적으로 측정

CrUX[Chrome UX 보고서): 단일 페이지 및 모든 페이지를 전체적으로 측정합니다

랩 데이터(합성 사용자 경험):

Lighthouse : 단일 페이지 측정

Chrome DevTools : 단일 페이지 측정

Web Vitals Chrome Extension : 단일 페이지 측정

롤링 28일 창 설명

CWV 측정, 특히 필드 데이터 측정 방법에서 롤링 28일 기간이 여러 번 나타나기 때문에 특히 이에 대해 한 단락을 할애합니다.

27일 동안 1.0의 끔찍한 CLS(Cumulative Layout Shift)가 있었고 28일에 마술처럼 0으로 수정했다고 상상해 보세요.

28일째에 평균 CLS는 0.96이며 다시 1.0으로 반올림됩니다.

Days      | 1    2    3    4    5    6    7    8    9    10   11   12   13   14   15   16   17   18   19   20   21   22   23   24   25   26   27   28
-------------------------------------------------------------------------------------------------------------------------------------------------------
Daily CLS | 1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  0.0 
Average   | 1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  1.0  0.96

위의 예에서 1.0에서 0으로의 CLS 최적화는 허용된 모바일 CLS 0.1에 도달할 때까지 +23일이 걸립니다.

다음 표에서 평균이 얼마나 느리게 감소하는지 확인하십시오.

Days      | +1   +2   +3   +4   +5   +6   +7   +8   +9   +10  +11  +12  +13  +14  +15  +16  +17  +18  +19  +20  +21  +22  +23  +24  +25  +26  +27  +28
-------------------------------------------------------------------------------------------------------------------------------------------------------
Daily CLS | 0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0  0.0 
Average   | 0.9  0.8  0.8  0.8  0.8  0.8  0.7  0.7  0.6  0.6  0.6  0.5  0.5  0.5  0.4  0.4  0.4  0.3  0.3  0.3  0.2  0.2  0.1  0.1  0.1  0.0  0.0  0.0

더 많은 리소스

An In-Depth Guide To Measuring Core Web Vitals

Google Forum: Explanation different data points in different tools

Tracking Changes in Search Console's Ore Web Vitals Report

Simon Wicki는 베를린의 프리랜서 개발자입니다. JustWatch에서 웹 및 모바일 앱 작업을 했습니다. Vue, Angular, React 및 Ionic에 능통합니다. 프론트엔드, 기술, 웹 성능 및 논픽션 서적에 대한 열정.

👉