구글 시트로 Core Web Vitals 매일 자동 측정하기
(labnol.org)- Core Web Vitals : 구글의 웹페이지 성능 지표
- 구글시트에 여러 웹사이트를 등록해 놓고 매일 한번씩 자동 실행해서 지표를 기록한뒤 그래프 표시
- 데스크탑/모바일 페이지의 FCP,FID,LCP,CLS,TTI 등을 모두 측정
1. 해당 시트를 복사
2. 첫 페이지 속도 측정할 URL 과 Sheet Name 기록
3. Sheet Name을 알맞게 변경
4. Track Web Vitals 누르면 측정 시작하고 매일 자동으로 한번씩 측정해서 기록 남김
코드를 보니 내부에서 구글 PageSpeedOnline 을 통해서 측정한후 그 내역을 파싱해서 구글 시트에 저장하는 방식이네요.
처음에 등록하면 보안 경고가 나오는데, 소스코드를 보면 아시겠지만 보안상 문제는 없는 코드에요
https://github.com/labnol/code/…
자동으로 측정하고 기록이 되니까, 일주일에 한번쯤 내용을 메일로 쏴주면 더 좋을것 같네요.
function sendEmail() {
ㅤvar sheets = SpreadsheetApp.getActiveSpreadsheet().getSheets();ㅤ
ㅤfor (var i = 0; i < sheets.length ; i++ ) {
ㅤㅤvar sheet = sheets[i];
ㅤㅤvar dataRange = sheet.getDataRange()
ㅤㅤvar cwvRange = sheet.getRange(2,1,dataRange.getLastRow()-1,dataRange.getLastColumn());
ㅤㅤvar numRows = cwvRange.getNumRows();
ㅤㅤvar numCols = cwvRange.getNumColumns();
ㅤㅤvar message = "CWT 값";
ㅤㅤfor (var i = 0; i < numRows; i++) {
ㅤㅤㅤㅤfor (var j = 0; j < numCols; j++) {
ㅤㅤㅤㅤ message = message + cwvRange.getValues()[i][j] + " | "
ㅤㅤㅤㅤ}
ㅤㅤㅤㅤmessage = message + "\r\n"
ㅤㅤ}
ㅤ}
ㅤMailApp.sendEmail("email@server", "이주의 Core Web Vitals", message);
}
구글, 검색결과 순위에 페이지 경험(Page Experience) 지표 도입 https://news.hada.io/topic?id=2197
- Core Web Vitals
ㅤ→ LCP : Largest Contentful Paint
ㅤ→ FID : First Input Delay
ㅤ→ CLS : Cumulative Layout Shift
Lighthouse 6.0 릴리즈 https://news.hada.io/topic?id=2122
ㅤ→ LCP,CLS,TBT 메트릭 추가
Cumulative Layout Shift (CLS) 란 무엇인가? https://news.hada.io/topic?id=1697
ㅤ→ 이미지/광고의 느린 로딩, 비동기 동작, 동적 DOM변경등으로 웹 페이지의 레이아웃이 얼마나 변하는 지를 측정
ㅤ→ 사용자가 잘못된 클릭을 유발하게 되는 시각적 불안정성을 체크하는 사용자 중심 성능 지표