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.
84
76%
Does it follow best practices?
Impact
96%
1.15xAverage score across 3 eval scenarios
Advisory
Suggest reviewing before use
Optimize this skill with Tessl
npx tessl skill review --optimize ./plugins/web-performance-optimization/skills/web-performance-optimization/SKILL.mdQuality
Discovery
100%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This is a strong skill description that clearly articulates specific capabilities, includes natural trigger terms developers would use, and explicitly states both what the skill does and when to use it. It uses proper third-person voice and is concise without being vague. The domain is well-defined and distinct from other potential skills.
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Lists multiple specific concrete actions: code splitting, lazy loading, caching strategies, Core Web Vitals monitoring, service workers, and reducing bundle sizes. | 3 / 3 |
Completeness | Clearly answers both what ('Optimizes web application performance through code splitting, lazy loading, caching strategies, and Core Web Vitals monitoring') and when ('Use when improving page load times, implementing service workers, or reducing bundle sizes'). | 3 / 3 |
Trigger Term Quality | Includes strong natural keywords users would say: 'page load times', 'bundle sizes', 'code splitting', 'lazy loading', 'service workers', 'Core Web Vitals', 'caching'. These are terms developers naturally use when seeking performance help. | 3 / 3 |
Distinctiveness Conflict Risk | Clearly scoped to web performance optimization with distinct triggers like 'Core Web Vitals', 'bundle sizes', 'service workers', and 'code splitting' that are unlikely to conflict with other skills. | 3 / 3 |
Total | 12 / 12 Passed |
Implementation
52%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
The skill excels at providing concrete, executable code examples across multiple performance optimization techniques, making it highly actionable. However, it lacks a coherent workflow — there's no sequencing, no measurement-before-optimization step, and no validation checkpoints to confirm improvements. It also includes some unnecessary content (generic best practices, well-known resource URLs) that Claude doesn't need.
Suggestions
Add a sequenced workflow section (e.g., '1. Measure baseline with Lighthouse, 2. Identify bottleneck, 3. Apply relevant optimization, 4. Re-measure and verify improvement') with explicit validation checkpoints.
Remove the 'Best Practices' bullet list and 'Resources' section — these are generic knowledge Claude already has, and they consume tokens without adding value.
Consolidate the INP/FID migration note to a single mention instead of repeating it in both the monitoring code comments and the performance targets section.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill is mostly efficient with good code examples, but includes unnecessary sections like 'Best Practices' (a generic bullet list Claude already knows), 'Resources' with well-known URLs, and the 'When to Use' section which is obvious. The INP/FID note is repeated twice. The sendToAnalytics explanation is overly verbose for Claude. | 2 / 3 |
Actionability | All code examples are concrete, executable, and copy-paste ready — React lazy loading, webpack config, service worker, nginx compression, and PerformanceObserver monitoring. Each section provides specific, implementable code rather than abstract guidance. | 3 / 3 |
Workflow Clarity | There is no sequenced workflow for implementing optimizations. The skill presents isolated techniques without ordering, dependencies, or validation steps. For a multi-faceted optimization task, there's no guidance on what to do first, how to measure before/after, or how to verify improvements — the checklist is just a flat list without sequence or checkpoints. | 1 / 3 |
Progressive Disclosure | References to compression-monitoring.md and typescript-advanced.md are well-signaled and one level deep, which is good. However, no bundle files were provided so these references are unverifiable. The main file itself is quite long (~180 lines) with sections like the full best practices list and resources that could be offloaded. | 2 / 3 |
Total | 8 / 12 Passed |
Validation
100%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 11 / 11 Passed
Validation for skill structure
No warnings or errors.
b30de6b
Table of Contents
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.