# Web vitals
[React] 리액트 리팩토링, 테스트부터 최적화까지
원티드 프리온보딩 프론트엔드 챌린지 8월 사전 과제하나의 모듈 / 컴포넌트가 기대한대로 동작하는지 독립적으로 진행하는 가장 작은 단위의 테스트입니다.해당하는 모듈만 독립적으로 테스트하기 때문에 빠르게 문제 여부를 확인할 수 있고, 테스트에 대한 시간과 비용을 절약할 수
폰트 CLS(Cumulative Layout Shift) 최적화
이번 시간에는 폰트에 대해 알아보겠습니다. 이미지와 더불어 폰트는 프론트엔드 입장에서는 매우 중요하면서도 까다로운 녀석이라고 할 수 있겠습니다. 그만큼 성능에 직접적인 영향을 미치기 때문인데요. 그래서 무엇보다 성능을 고려해서 최적화를 해주는 게 좋습니다.
이미지 Largest Contentful Paint (LCP) 최적화
요즘 프론트엔드 트렌드 하면 웹 성능과 최적화 방법에 대한 내용이 아닐까 싶습니다. 저 또한 관심이 많은 편인데요. 오늘은 그 중에서 LCP 라는 측정 지표에 대해 알아보면서 간단하게 이미지를 가지고 테스트를 진행해볼까 합니다.
[번역] 2023년 최고의 Core Web Vitals 권장 사항들
Google Chrome DevRel 팀이 제안하는 Core Web Vitals 성능 개선 권장사항들을 소개합니다.
Largest Contentful Paint
참고자료 https://web.dev/i18n/ko/lcp/ LCP란? google에서 제시한 core web vitals 지표 중 하나 페이지가 처음 로드를 시작한 시점을 기준으로 뷰포트 내에 있는 가장 큰 이미지 또는 텍스트 블록의 렌더링 시간 google에서
Web Vitals | Interaction to Next Paint (INP) 번역
본 문은 Jeremy Wagner가 작성한 Interaction to Next Paint (INP) 을 번역한 글입니다.
💻 Web Vitals(feat. next/Image 적용 경험)
⚠️ 정리한 내용은 오타나 잘못된 정보가 있을 수 있습니다. 댓글로 알려주시면 감사하겠습니다. Web Vitals Web Vitals는 웹에서 우수한 사용자 경험을 제공하는 데 필수적인 품질 신호에 대한 통합 지침을 제공하기 위한 Google
웹 사이트 성능 측정, Web Vitals
웹 사이트의 성능과 사용자 경험의 품질을 정량적으로 측정하는 지표인 Google의 Web Vitals에 대해 살펴봅니다.
[HTML/CSS] Web vitals
: 품질 지표에 대한 통합적 지침을 제시Chrome UX Report : 실제 Chrome 사용자가 경험하는대로, 각 Web Vital에 대해 사이트의 성능을 빠르게 평가할 수 있음: 핵심 사용자 경험 요구사항. 모든 웹 경험에서 중요한 사용자 경험의 공통 집합\[ht