Lighthouse 로 Web Vitals 최적화 하기
(web.dev)- Core Web Vitals 측정
- Largest Contentful Paint 개체 찾기
- LCP 개선을 위해 프리로드 하기
- Cumulative Layout Shift 영향주는 개체 찾기
ㅤ→ 사이즈 없는 이미지들
ㅤ→ 광고들
ㅤ→ non-composited 애니메이션들
- First Input Delay / Total Blocking Time / Long Tasks 디버깅 하기
구글, 검색결과 순위에 페이지 경험(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변경등으로 웹 페이지의 레이아웃이 얼마나 변하는 지를 측정
ㅤ→ 사용자가 잘못된 클릭을 유발하게 되는 시각적 불안정성을 체크하는 사용자 중심 성능 지표