Does it support modern image optimization?

It provides strategies for implementing responsive images, converting to modern formats like WebP and AVIF, and applying native lazy loading for non-critical assets.

How does this skill improve Core Web Vitals?

It analyzes metrics like LCP and CLS to provide specific code fixes, such as optimizing hero images, implementing preloading, and setting explicit dimensions to prevent layout shifts.

Can it help reduce JavaScript bundle size?

Yes, it identifies heavy dependencies using bundle analysis and suggests code splitting, tree shaking, and lighter library alternatives to decrease load times.

Is it compatible with frameworks like Next.js or React?

Yes, it includes specific implementation patterns for popular frameworks, including dynamic imports, specialized image components, and route-based code splitting.

Web Performance Optimization

Name: Web Performance Optimization
Author: claudiodearaujo

byclaudiodearaujo

•

분석 및 모니터링

Optimizes website speed and performance metrics including Core Web Vitals, bundle sizes, and caching strategies.

This skill empowers developers to systematically improve website performance by measuring, analyzing, and resolving bottlenecks in loading speed and runtime efficiency. It provides expert guidance on optimizing Core Web Vitals (LCP, FID, CLS), reducing JavaScript bundle sizes through code splitting, implementing advanced caching strategies, and optimizing assets like images and fonts to ensure a seamless user experience and improved SEO rankings.

주요 기능

01Critical rendering path and lazy loading implementation

02Advanced image optimization and modern format conversion

03Comprehensive performance benchmarking and Lighthouse audits

041 GitHub stars

05JavaScript bundle size reduction and tree shaking

06Core Web Vitals auditing and optimization (LCP, FID, CLS)

사용 사례

01Improving slow-loading web applications for better user retention

02Passing Google's Core Web Vitals assessment for SEO benefits

03Reducing mobile data usage by optimizing asset delivery and bundle sizes

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add claudiodearaujo/sistema-de-narra-o-de-livro web-performance-optimization

For use in Claude.ai and ChatGPT

Download Skill

주요 기능

01Critical rendering path and lazy loading implementation

02Advanced image optimization and modern format conversion

03Comprehensive performance benchmarking and Lighthouse audits

041 GitHub stars

05JavaScript bundle size reduction and tree shaking

06Core Web Vitals auditing and optimization (LCP, FID, CLS)

사용 사례

01Improving slow-loading web applications for better user retention

02Passing Google's Core Web Vitals assessment for SEO benefits

03Reducing mobile data usage by optimizing asset delivery and bundle sizes

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add claudiodearaujo/sistema-de-narra-o-de-livro web-performance-optimization

For use in Claude.ai and ChatGPT

Download Skill