skills.rest
berkcangumusisik
berkcangumusisikCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

lighthouse-fix

Analyze React/TypeScript code and assets to fix Lighthouse performance issues.

11|Updated Apr 16, 2026
Search Tags:#performance#lighthouse#web-vitals#lcp#cls#fid
One-click install
npx skills add https://github.com/berkcangumusisik/claude-code-practices --skill lighthouse-fix
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: lighthouse-fix
Source: https://github.com/berkcangumusisik/claude-code-practices/tree/main/skills/lighthouse-fix
Command: npx skills add https://github.com/berkcangumusisik/claude-code-practices --skill lighthouse-fix

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps developers identify and fix common Lighthouse performance score killers in web projects, reducing time spent on per-page audits and manual tuning.

Core Features & Use Cases

  • Evaluate performance indicators such as LCP, CLS, and FID/INP and suggest practical improvements.
  • Check accessibility and best practices issues and provide concrete fixes.
  • Produce actionable guidance that can be applied directly in the codebase, with an emphasis on deterministic improvements.

Quick Start

Run lighthouse-fix against your target page URL to identify and fix common Lighthouse score issues.

Frequently Asked Questions about lighthouse-fix

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

FAQPage Schema
How do I improve my Lighthouse performance score in a React project?▼

It improves Lighthouse performance scores by analyzing your React/TypeScript codebase and assets to identify LCP, CLS, and FID/INP issues, proposing fixes like preload hints and script defer improvements.

What is the best way to fix Cumulative Layout Shift caused by images?▼

The best way to fix Cumulative Layout Shift is by adding explicit image dimensions to your assets. This Skill uses static analysis hints to detect missing dimensions and suggests guardrails to prevent layout shifts.

Can I use static analysis to find web vitals issues without running a runtime environment?▼

You can find web vitals issues without a runtime. This Skill requires no runtime execution and uses static analysis hints on your source code and assets to propose fixes for LCP and CLS problems.

How do I optimize font loading to prevent LCP delays in TypeScript?▼

To optimize font loading and prevent LCP delays, implement font-display swap. This Skill analyzes your codebase to suggest this improvement along with other LCP optimizations.

Does this Lighthouse diagnostic tool check accessibility and best practices?▼

This Lighthouse diagnostic tool checks accessibility and best practices. Alongside performance indicators like LCP and CLS, it identifies issues and provides concrete fixes for accessibility compliance.

Related Skills

Explore More Software Engineering Skills→
JewelsHovanJewelsHovan

component-organization

Organize React TypeScript codebases into barrel-exported src/ directory structures.

Community
Basic
Smooth-OperationSmooth-Operation

lighthouse-performance-optimization

Automate Lighthouse audits to measure web performance and generate reports.

Official
Advanced
marcusagmmarcusagm
4

lint-and-validate

Run linting, type checking, and security audits across Node.js/TypeScript and Python projects.

Community
Intermediate
abzhawabzhaw

performance-profiling

Run Lighthouse-based audits to measure web performance metrics like LCP, INP, and CLS.

Community
Intermediate