What kind of asset optimizations does it perform?

It implements image format conversion (WebP/AVIF), CSS minification, JavaScript deferral, font-display strategies, and cache-busting filename configurations.

Can it modify my database or backend business logic?

No, the skill's safety boundaries prevent it from modifying database schemas, authentication logic, or core business rules. It is strictly scoped to performance-related changes.

What are its target performance budgets?

The skill aims for uncompressed HTML and CSS under 50KB, JS enhancers under 30KB, LCP under 2.5s, and TTFB under 200ms.

What metrics does the perf skill optimize?

It specifically targets Core Web Vitals including Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), and Interaction to Next Paint (INP), as well as Time to First Byte (TTFB).

Does it support server-side optimization?

Yes, it can configure Express middleware for compression (Brotli/Gzip) and set efficient Cache-Control and ETag headers.

Web Performance Optimizer

Name: Web Performance Optimizer
Author: coakenfold

bycoakenfold

0•

分析与监控

Optimizes website load times and Core Web Vitals through asset minification, critical path analysis, and efficient resource delivery.

This skill transforms Claude into a specialized performance engineer focused on maximizing web application speed and efficiency. It audits and optimizes Core Web Vitals like Largest Contentful Paint (LCP) and Cumulative Layout Shift (CLS) by refining the critical rendering path, implementing advanced caching strategies, and optimizing assets such as CSS, JavaScript, fonts, and images. Designed for developers working on progressively enhanced applications, it enforces strict performance budgets and ensures modern delivery standards like Brotli compression and resource hinting are correctly implemented across both frontend code and backend middleware.

主要功能

01Core Web Vitals (LCP, CLS, INP) measurement and optimization

02Asset optimization for images (WebP/AVIF), CSS, JS, and fonts

03Server-side performance tuning including caching headers and compression

04Critical rendering path analysis and resource-blocking elimination

05Implementation of resource hints like preload, preconnect, and prefetch

060 GitHub stars

使用场景

01Improving Google PageSpeed Insights and Lighthouse scores for better SEO

02Optimizing asset delivery pipelines in Vite or Express environments

03Reducing bundle sizes and payload weights to meet strict performance budgets

主要功能

01Core Web Vitals (LCP, CLS, INP) measurement and optimization

02Asset optimization for images (WebP/AVIF), CSS, JS, and fonts

03Server-side performance tuning including caching headers and compression

04Critical rendering path analysis and resource-blocking elimination

05Implementation of resource hints like preload, preconnect, and prefetch

060 GitHub stars

使用场景

01Improving Google PageSpeed Insights and Lighthouse scores for better SEO

02Optimizing asset delivery pipelines in Vite or Express environments

03Reducing bundle sizes and payload weights to meet strict performance budgets