Which specific metrics does the skill track?

It focuses on industry-standard Core Web Vitals, including Largest Contentful Paint (LCP) for loading, Interaction to Next Paint (INP) for interactivity, and Cumulative Layout Shift (CLS) for visual stability.

What tools does this skill utilize?

It guides the use of Lighthouse, Bundle Analyzers, and Chrome DevTools (Performance, Memory, and Network tabs) to gather data-driven insights.

Does it help with memory leak detection?

Yes, it provides specific analysis patterns for the Memory tab to identify growing heaps, retained references, and detached DOM elements.

How does this skill help improve web performance?

It provides a structured workflow to measure current performance, identify specific bottlenecks like large bundles or long tasks, and implement targeted fixes.

Can I automate performance testing with this skill?

Yes, the skill includes scripts for automated Lighthouse audits that can be executed during development or integrated into CI/CD pipelines.

Performance Profiling & Optimization

Name: Performance Profiling & Optimization
Author: claudiodearaujo

byclaudiodearaujo

0•

分析与监控

Optimizes web application performance through systematic measurement, analysis, and targeted runtime improvement techniques.

This skill provides a comprehensive framework for Claude to diagnose and resolve web performance issues. It implements a rigorous 'Measure, Analyze, Optimize' workflow, focusing on Core Web Vitals like LCP, INP, and CLS. By leveraging tools such as Lighthouse, bundle analyzers, and DevTools profiling, it helps developers identify bottlenecks in JavaScript execution, bundle sizes, and rendering cycles to ensure production-grade speed and stability.

主要功能

01Deep-dive bundle analysis for code splitting and tree shaking

02Core Web Vitals target tracking for LCP, INP, and CLS

030 GitHub stars

04Systematic 4-step profiling workflow: Baseline, Identify, Fix, Validate

05Automated Lighthouse performance auditing via integrated scripts

06Runtime and memory analysis to detect leaks and UI jank

使用场景

01Debugging complex runtime issues like memory leaks or layout thrashing

02Reducing application bundle size to decrease time-to-interactive for mobile users

03Improving page load speed and search engine rankings by optimizing Core Web Vitals

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add claudiodearaujo/sistema-de-narra-o-de-livro-front performance-profiling

For use in Claude.ai and ChatGPT

主要功能

01Deep-dive bundle analysis for code splitting and tree shaking

02Core Web Vitals target tracking for LCP, INP, and CLS

030 GitHub stars

04Systematic 4-step profiling workflow: Baseline, Identify, Fix, Validate

05Automated Lighthouse performance auditing via integrated scripts

06Runtime and memory analysis to detect leaks and UI jank

使用场景

01Debugging complex runtime issues like memory leaks or layout thrashing

02Reducing application bundle size to decrease time-to-interactive for mobile users

03Improving page load speed and search engine rankings by optimizing Core Web Vitals

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add claudiodearaujo/sistema-de-narra-o-de-livro-front performance-profiling

For use in Claude.ai and ChatGPT