Community코딩 & 개발github.com

addyosmani/core-web-vitals

코어 웹 바이탈(LCP, INP, CLS)을 최적화하여 페이지 경험과 검색 순위를 개선합니다. 'Core Web Vitals 개선', 'LCP 수정', 'CLS 감소', 'INP 최적화', '페이지 경험 최적화' 또는 '레이아웃 이동 수정'과 같은 요청에 사용하세요.

core-web-vitals란 무엇인가요?

이 스킬은 웹 페이지의 코어 웹 바이탈(Core Web Vitals) 지표인 LCP(Largest Contentful Paint), INP(Interaction to Next Paint), CLS(Cumulative Layout Shift)를 분석하고 최적화하는 방법을 제공합니다. 개발자는 이 스킬을 사용하여 페이지 로딩 성능, 상호작용 응답성, 시각적 안정성을 개선함으로써 더 나은 사용자 경험과 검색 엔진 순위 향상을 달성할 수 있습니다. 이 스킬은 모든 웹 개발 플랫폼과 프레임워크에서 사용 가능하며, 구체적인 최적화 전략(이미지 최적화, 코드 분할, 지연 로딩, 레이아웃 안정화 등)을 제시합니다. 또한 성능 측정 도구(Lighthouse, PageSpeed Insights, Web Vitals 라이브러리)를 활용한 진단 방법과 실제 적용 가능한 코드 예제를 포함하여 개발자가 즉시 실행할 수 있도록 지원합니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/addyosmani/web-quality-skills/tree/main/skills/core-web-vitals

Installed? Explore more 코딩 & 개발 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

core-web-vitals은(는) 무엇을 하나요?

코어 웹 바이탈(LCP, INP, CLS)을 최적화하여 더 나은 페이지 경험과 검색 순위를 달성하세요. "Core Web Vitals 개선", "LCP 수정", "CLS 감소", "INP 최적화", "페이지 경험 최적화" 또는 "레이아웃 이동 수정"과 같은 요청이 있을 때 사용하세요.

Individual skills in this repo

This repo contains 5 individual skills — each has its own dedicated page.

관련 스킬