web-performance-optimization

Optimizes web application performance through code splitting, lazy loading, caching strategies, and Core Web Vitals monitoring. Use when improving page load times, implementing service workers, or reducing bundle sizes.

1.15x

Quality

86%

Does it follow best practices?

Impact

96%

1.15x

Average score across 3 eval scenarios

Securityby

Advisory

Suggest reviewing before use

Evaluation results

90%

Web Vitals Monitoring Module

Core Web Vitals monitoring

Criteria

Without context

With context

LCP observer type

100%

CLS observer type

100%

CLS hadRecentInput filter

100%

INP tracked not FID

100%

FID not primary metric

100%

TTFB tracked

100%

TTFB calculation

sendToAnalytics signature

100%

LCP threshold documented

100%

INP threshold documented

100%

CLS threshold documented

100%

INP replaces FID noted

100%

21%

React Dashboard Bundle Optimization

Bundle optimization and code splitting

Criteria

Without context

With context

React.lazy usage

100%

Suspense wrapper

62%

100%

lazyLoad utility

100%

splitChunks chunks: all

100%

Vendor cacheGroup

100%

TerserPlugin present

100%

drop_console enabled

100%

CompressionPlugin present

100%

Compression threshold

100%

Compression minRatio

100%

Gzip filename pattern

100%

Algorithm gzip

100%

19%

Offline-Ready Travel Blog with Optimized Images

Image optimization and service worker caching

Criteria

Without context

With context

ImageProps interface

100%

webp src derivation

100%

picture element used

87%

100%

loading=lazy default

100%

decoding=async

100%

SW install caches assets

100%

SW cache-first strategy

100%

SW 200-only caching

70%

100%

SW offline fallback

100%

Nginx gzip on

100%

Nginx gzip_types

100%

Nginx gzip_min_length

100%

Nginx gzip_comp_level

100%

Repository: secondsky/claude-skills
Commit: 88da5ff

Evaluated: about 1 month ago
Agent: Claude Code
Model: Claude Sonnet 4.6

Table of Contents

Web Vitals Monitoring Module React Dashboard Bundle Optimization Offline-Ready Travel Blog with Optimized Images

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.