skills.rest
felipebrgs1
felipebrgs1COMMUNITY
Explore all skills by this author →
GitHub

core-web-vitals

Optimize Core Web Vitals by analyzing and implementing loading, interactivity, and stability fixes.

Updated Feb 26, 2026
Search Tags:#performance#web vitals#optimization#lcp#page speed#inp#cls
One-click install
npx skills add https://github.com/felipebrgs1/skills --skill core-web-vitals-felipebrgs1
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: core-web-vitals
Source: https://github.com/felipebrgs1/skills/tree/main/web/core-web-vitals
Command: npx skills add https://github.com/felipebrgs1/skills --skill core-web-vitals-felipebrgs1

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill addresses issues that negatively impact Core Web Vitals (LCP, INP, CLS), leading to a better user experience and improved search engine rankings.

Core Features & Use Cases

  • LCP Optimization: Identifies and resolves slow loading times for the largest content element.
  • INP Improvement: Enhances page responsiveness by reducing interaction delays.
  • CLS Reduction: Minimizes unexpected layout shifts for a stable visual experience.
  • Use Case: When your website's performance metrics are poor, use this Skill to diagnose and fix the underlying causes of slow loading, unresponsiveness, and layout instability.

Quick Start

Use the core-web-vitals skill to optimize the largest contentful paint for the current page.

Frequently Asked Questions about core-web-vitals

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

FAQPage Schema
How do I optimize Core Web Vitals for better page speed?▼

Reduce CLS by identifying and resolving un-dimensioned elements that cause unexpected layout shifts. This Skill analyzes visual stability issues and implements solutions to ensure a stable page rendering experience for users.

Why does my website have a poor Interaction to Next Paint score?▼

Improve LCP by identifying and resolving slow loading times for the largest contentful element. This Skill diagnoses slow server response times and render-blocking resources to enhance overall loading performance.

What's the best way to reduce Cumulative Layout Shift on my website?▼

Reduce CLS by identifying and resolving un-dimensioned elements that cause unexpected layout shifts. This Skill analyzes visual stability issues and implements solutions to ensure a stable page rendering experience for users.

Why does my website have a poor Interaction to Next Paint score?▼

A poor INP score is caused by long tasks that delay page responsiveness. Improve interaction delays by analyzing interactivity bottlenecks and implementing performance best practices to reduce main thread blocking.

How do I fix a slow Largest Contentful Paint loading time?▼

Improve LCP by identifying and resolving slow loading times for the largest contentful element. This Skill diagnoses slow server response times and render-blocking resources to enhance overall loading performance.

Can I use the web-vitals npm package to measure Core Web Vitals?▼

Yes, this Skill utilizes the web-vitals dependency to measure performance metrics. It leverages these measurement tools alongside framework-specific best practices to diagnose and resolve loading, interactivity, and visual stability issues.

Related Skills

Explore More Software Engineering Skills→
paialexpaialex
1

core-web-vitals

Diagnose and optimize LCP, INP, and CLS on web pages.

Community
Intermediate
CatsofsufferingCatsofsuffering
5

optimize

Diagnose and fix UI performance issues in web applications using Core Web Vitals.

Community
Advanced
adrigonz-sftsadrigonz-sfts

core-web-vitals

Optimize LCP, INP, and CLS metrics through code and configuration adjustments.

Community
Advanced
pacphipacphi
6

performance-testing

Plan and execute load, stress, spike, endurance, and scalability tests.

Community
Advanced