core-web-vitals

Name: core-web-vitals
Availability: InStock
Author: kennyolofsson23-netizen

Audit web pages and generate optimization checklists for LCP, INP, and CLS.

1|Updated Mar 15, 2026

Search Tags:#performance #seo #core-web-vitals #lcp #inp #cls

Ready to run

npx skills add https://github.com/kennyolofsson23-netizen/claude-code-config --skill core-web-vitals-kennyolofsson23-netizen

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: core-web-vitals
Source: https://github.com/kennyolofsson23-netizen/claude-code-config/tree/main/skills/core-web-vitals
Command: npx skills add https://github.com/kennyolofsson23-netizen/claude-code-config --skill core-web-vitals-kennyolofsson23-netizen

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Websites with poor Core Web Vitals—Largest Contentful Paint, Interaction to Next Paint, and Cumulative Layout Shift—suffer slower load times, unresponsive interactions, and visual instability, leading to lower Google rankings and a bad user experience.

Core Features & Use Cases

Provides detailed explanations of LCP, INP, and CLS metrics and the thresholds for Good, Needs work, and Poor.
Offers actionable checklists for each metric, including server response optimization, render‑blocking resource handling, image preloading, event‑handler efficiency, and layout‑shift prevention.
Supplies framework‑specific quick fixes for Next.js, React, and Vue/Nuxt, and lists measurement tools such as Chrome DevTools, Lighthouse, WebPageTest, and the web‑vitals JavaScript library.
Includes reference documents for deeper guidance on LCP, INP, and CLS.

Quick Start

Ask the core-web-vitals skill to audit a page and provide optimization steps for LCP, INP, and CLS.

Frequently Asked Questions about core-web-vitals

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I improve Core Web Vitals like LCP, INP, and CLS for better SEO?▼

Improve Core Web Vitals by auditing pages to optimize Largest Contentful Paint, Interaction to Next Paint, and Cumulative Layout Shift thresholds. This skill generates actionable checklists for server response optimization, render-blocking resource handling, and layout-shift prevention to satisfy Google Search ranking requirements.

What is the best way to fix Cumulative Layout Shift in Next.js and React?▼

Fix Cumulative Layout Shift in Next.js and React by applying framework-specific quick fixes that prevent visual instability. This skill provides targeted code changes for rendering and layout improvements, ensuring stable pages and compliance with Web Vitals thresholds.

How do I optimize Interaction to Next Paint (INP) for unresponsive web pages?▼

Optimize Interaction to Next Paint by improving event-handler efficiency to resolve unresponsive user interactions. The skill supplies optimization checklists and code changes targeting rendering and script execution to meet Good INP threshold standards.

Can I use Chrome DevTools and Lighthouse to measure Core Web Vitals performance?▼

You can measure Core Web Vitals performance using Chrome DevTools, Lighthouse, WebPageTest, and the web-vitals JavaScript library. This skill references these measurement tools to audit web pages and verify LCP, INP, and CLS metric thresholds.

Why does my page suffer from slow Largest Contentful Paint and how do I optimize it?▼

Slow Largest Contentful Paint often stems from poor server response times and render-blocking resources. Optimize LCP by applying this skill's checklists for server response optimization, image preloading, and resource handling to achieve faster load times.

Does this Core Web Vitals skill support Vue and Nuxt framework fixes?▼

This Core Web Vitals skill supports Vue and Nuxt by supplying framework-specific quick fixes for rendering and layout improvements. It audits pages and suggests code changes tailored to these frameworks to resolve LCP, INP, and CLS performance issues.