CtrlK
BlogDocsLog inGet started
Tessl Logo

frontend-excellence

Modern frontend patterns for React Server Components, performance optimization, and Core Web Vitals

52

Quality

57%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./skills/frontend-excellence/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

65%

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The body is highly actionable with executable examples and concrete config, but it is a flat reference catalog rather than a sequenced workflow, and it keeps all detail inline without progressive disclosure to separate files.

Suggestions

Trim conceptual explanations Claude already knows (e.g. what Server Components are, how Suspense streaming works) to keep only the actionable rules.

If the skill is meant to guide an optimization pass, add an ordered workflow with validation checkpoints (measure -> change -> re-measure with web-vitals).

Move deeper detail (Core Web Vitals tuning tables, image/font loading specifics) into reference files and link them one level deep to shorten the overview.

DimensionReasoningScore

Conciseness

The body is mostly lean code with brief rules and checklists, but it opens by explaining what Server Components are and restates concepts Claude already knows (e.g. 'Each Suspense boundary streams independently').

2 / 3

Actionability

It provides fully executable, copy-paste-ready examples (.tsx, next.config.js, web-vitals) plus specific commands like 'npx next build' and concrete config values, with no pseudocode.

3 / 3

Workflow Clarity

Content is organized into checklists and rules, but there is no sequenced multi-step workflow with explicit validation checkpoints or feedback loops for the optimization work it describes.

2 / 3

Progressive Disclosure

Sections are clearly headed and well-organized, but at roughly 175 lines all content is inline with no external reference files to split detailed topics (e.g. CWV tuning, image/font optimization) out of the overview.

2 / 3

Total

9

/

12

Passed

Description

50%

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

The description identifies a clear, specific domain but stops short of stating concrete actions or any 'Use when...' trigger guidance. It is recognizable but would benefit from explicit triggers and verb-based capabilities.

Suggestions

Add concrete actions in third person, e.g. 'Optimizes React Server Component boundaries, splits bundles, and tunes Core Web Vitals (LCP, INP, CLS).'

Append an explicit trigger clause: 'Use when improving frontend performance, reducing bundle size, or fixing Core Web Vitals metrics.'

Include natural variations users would say — LCP, CLS, INP, bundle size, rendering, hydration — to broaden trigger coverage.

DimensionReasoningScore

Specificity

The description names a clear domain ('React Server Components, performance optimization, and Core Web Vitals') but describes no concrete actions — 'Modern frontend patterns for' is abstract rather than listing things like optimize, split, or measure.

2 / 3

Completeness

It states what the skill covers but lacks any 'Use when...' clause or equivalent trigger guidance, which caps completeness at 2 per the judging guidelines.

2 / 3

Trigger Term Quality

It includes some natural terms a developer might say ('React Server Components', 'Core Web Vitals') but misses common variations such as LCP, CLS, INP, bundle size, or rendering.

2 / 3

Distinctiveness Conflict Risk

The RSC/Core Web Vitals niche is fairly specific but could still overlap with a general React or frontend skill, and without explicit triggers there is nothing to disambiguate.

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.

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
rohitg00/awesome-claude-code-toolkit
Reviewed

Table of Contents

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.