Automatically scan and fix Largest Contentful Paint, Cumulative Layout Shift, and First Input Delay issues using AI guidance.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install core-vitals-fix
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install core-vitals-fix using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is Core Vitals Fixer?
The Core Vitals Fixer is a specialized utility within the Openclaw Skills collection designed to bridge the gap between poor Lighthouse scores and a high-performance user experience. By scanning your source code for common performance antipatterns, it provides specific, actionable AI-generated fixes to resolve bottlenecks in LCP, FID, and CLS. It is a zero-config tool intended to help developers maintain peak site health without manual auditing.
This skill leverages the power of GPT-4o-mini to analyze code structure and identify issues like unoptimized assets or non-deferred scripts that bloat your page weight. As part of the Openclaw Skills ecosystem, it prioritizes fixes by their impact, ensuring that developers focus on the most critical performance wins first to satisfy both users and search engine algorithms.
Core Vitals Fixer Use Cases
- When Lighthouse scores are declining and negatively impacting your SEO strategy.
- Resolving Core Web Vitals failures flagged in Google Search Console.
- Auditing new projects during development to ensure performance best practices are met using Openclaw Skills.
- Addressing specific user complaints regarding layout shifts or sluggish interactivity.
- Optimizing legacy codebases for modern web performance standards.
How Core Vitals Fixer Works
- The skill scans your local directory (e.g., ./src or ./app) to map out the frontend architecture.
- It identifies common performance triggers such as unoptimized images, missing dimensions, or blocking JavaScript.
- Relevant code segments are analyzed through the Openclaw Skills framework to determine the root cause of high LCP or CLS.
- The tool generates a detailed report with prioritized code examples and implementation instructions.
- Developers apply the AI-recommended fixes to improve real-world performance metrics.
Core Vitals Fixer Setup
Core Vitals Fixer requires Node.js 18+ and an OpenAI API key. No permanent installation is required as it can be run via npx. Set your environment variable and execute the scan:
export OPENAI_API_KEY='your_api_key_here'
npx ai-core-vitals ./src/
To view help and additional options, run:
npx ai-core-vitals --help
Core Vitals Fixer Data Schema & Taxonomy
The skill organizes its analysis based on the three core pillars of web performance. It processes source files and generates a taxonomy of issues as follows:
| Metric | Analysis Type | Fix Focus |
|---|---|---|
| LCP | Asset loading & Server response | Image optimization and critical path rendering |
| CLS | Layout stability | Aspect ratios and reserved space for dynamic content |
| FID | Interactivity & Main thread | Script deferral and minimizing JS execution time |
All suggestions provided by Openclaw Skills are mapped directly to the affected file paths and line numbers.
Core Vitals Fixer Advanced Features
- Metric-specific targeting allowing you to isolate and fix only LCP or CLS issues.
- Prioritization engine that ranks fixes by 'High', 'Medium', or 'Low' impact for efficient workflow management.
- Integration-ready CLI output that can be incorporated into pre-commit hooks or CI/CD pipelines.
- Support for multiple frontend structures, including React, Next.js, and standard HTML/CSS setups within the Openclaw Skills environment.
SKILL.md
Loading
Related Openclaw Skills
Compound Engineering
A self-improving memory system that enables AI agents to learn from every session and compound knowledge over time.
Compound Engineering
An automated learning framework that enables AI agents to review their work, extract patterns, and compound knowledge daily.
Component Gen
Turn natural language descriptions into fully functional React components with TypeScript and Tailwind support.
Comment Generator
An AI-driven CLI tool that injects meaningful inline comments into source code to explain the intent and reasoning behind complex logic.
Core Web Vitals Fixer
An AI-powered CLI tool designed to scan codebases and provide instant, actionable fixes for Core Web Vitals performance bottlenecks.
CORS Generator (cors-gen)
A powerful CLI tool within the Openclaw Skills ecosystem that generates exact CORS configurations for any tech stack using natural language descriptions.
Featured*
