core-web-vitals

Diagnose and resolve Core Web Vitals issues with code examples and checklists.

Updated Mar 13, 2026
One-click install
npx skills add https://github.com/adcuelloa/restaurant-order --skill core-web-vitals-adcuelloa
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: core-web-vitals
Source: https://github.com/adcuelloa/restaurant-order/tree/main/.agents/skills/core-web-vitals
Command: npx skills add https://github.com/adcuelloa/restaurant-order --skill core-web-vitals-adcuelloa

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires web-vitals, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill addresses critical performance bottlenecks in web pages, directly impacting user experience, search engine rankings, and conversion rates by optimizing Core Web Vitals.

Core Features & Use Cases

  • LCP Optimization: Reduces Largest Contentful Paint by addressing slow server responses, render-blocking resources, and slow resource loading.
  • INP Improvement: Enhances Interactivity to Next Paint by minimizing main thread blocking, optimizing event handlers, and deferring third-party scripts.
  • CLS Reduction: Minimizes Cumulative Layout Shift by preventing unexpected content movements caused by images without dimensions, ads, or dynamic content.
  • Use Case: A user wants to improve their website's performance score and reduce bounce rates. This Skill provides actionable steps and code examples to fix LCP, INP, and CLS issues.

Quick Start

Use the core-web-vitals skill to analyze and provide recommendations for improving the Largest Contentful Paint on the provided URL.

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 scores for my website?

Improve Core Web Vitals by diagnosing and resolving loading speed, interactivity, and visual stability issues. This involves optimizing LCP, INP, and CLS through render-blocking resource reduction, main thread blocking minimization, and preventing unexpected layout shifts.

What is the best way to reduce Cumulative Layout Shift on web pages?

Reduce Cumulative Layout Shift by preventing unexpected content movements caused by images without dimensions, ads, or dynamic content. Apply specific code examples and checklists to ensure visual stability during page rendering.

How can I optimize Largest Contentful Paint when server response is slow?

Optimize Largest Contentful Paint by addressing slow server responses, render-blocking resources, and slow resource loading. Detailed explanations and code examples help reduce loading times and enhance user experience.

Why does Interactivity to Next Paint fail on pages with third-party scripts?

Interactivity to Next Paint fails when third-party scripts block the main thread. Improve INP by minimizing main thread blocking, optimizing event handlers, and deferring third-party script execution to enhance page speed.

Do I need the web-vitals library to measure page speed metrics?

The web-vitals library is used as a dependency to measure page speed metrics. It provides the data needed to diagnose performance bottlenecks and verify improvements for LCP, INP, and CLS optimization.