skills.rest
wearemssatoshi
wearemssatoshiCOMMUNITY
Explore all skills by this author →
𝕏@wearems_satoshiGitHub

core-web-vitals

Optimize Core Web Vitals (LCP, INP, CLS) with diagnostic steps and code examples.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses issues that negatively impact user experience and search engine rankings by optimizing Core Web Vitals (LCP, INP, CLS).

Core Features & Use Cases

  • LCP Optimization: Identifies and resolves slow server responses, render-blocking resources, and slow resource load times.
  • INP Optimization: Detects and fixes long tasks, heavy event handlers, and third-party script issues that cause unresponsiveness.
  • CLS Optimization: Prevents unexpected layout shifts caused by images without dimensions, ads, dynamic content, and font loading.
  • Use Case: Improve your website's performance scores in Google Lighthouse and Search Console by following the actionable checklists and code examples provided.

Quick Start

Use the core-web-vitals skill to analyze and optimize the Largest Contentful Paint for the homepage.

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 like LCP, INP, and CLS to improve page speed?▼

To optimize Core Web Vitals, you must address LCP, INP, and CLS by resolving slow server responses, render-blocking resources, long tasks, and layout shifts. This improves page speed and search rankings.

What causes a poor Largest Contentful Paint score and how can I fix it?▼

A poor LCP score is caused by slow server response times, render-blocking resources, and slow resource load times. Fix it by identifying bottlenecks and applying diagnostic steps and code examples to speed up loading.

How do I fix unexpected layout shifts to reduce CLS on my web pages?▼

Unexpected layout shifts causing poor CLS are fixed by addressing images without dimensions, ads, dynamic content, and font loading issues. Preventing these shifts stabilizes the visual page experience for users.

Why does my page become unresponsive and how do I optimize INP?▼

Pages become unresponsive due to long tasks, heavy event handlers, and third-party scripts. Optimize INP by detecting and fixing these issues to ensure smooth interactivity and better page experience scores.

Can I use this approach to improve Google Lighthouse and Search Console performance scores?▼

Yes, you can improve Google Lighthouse and Search Console scores by following actionable checklists and code examples to optimize LCP, INP, and CLS, directly resolving common performance bottlenecks.

Related Skills

Explore More Software Engineering Skills→
MisonLMisonL
8

performance-profiling

Collect Core Web Vitals and Lighthouse scores to measure web performance.

Community
Intermediate
aroidoaroido

Web Vitals Monitoring Skill

Measure Core Web Vitals and enforce performance budgets in CI/CD pipelines.

Official
Advanced
SylphxAISylphxAI
4

performance

Analyze Next.js frontend performance for Core Web Vitals and bundle size.

Official
Intermediate
HollowvynHollowvyn

server-side-rendering

Generate complete HTML on the server for React applications.

Official
Intermediate