Framework-agnostic frontend architecture — state management, components, data fetching. Use when building any web frontend, choosing state patterns, or structuring UI code.
79
70%
Does it follow best practices?
Impact
95%
1.10xAverage score across 3 eval scenarios
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./skills/platform/platform-frontend/SKILL.mdQuality
Discovery
67%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 description has good structure with an explicit 'Use when' clause that clearly communicates both purpose and triggers. However, it relies on somewhat abstract category names rather than concrete actions, and the trigger terms could be expanded to include more natural user language and common framework/library names that users would mention.
Suggestions
Add more specific concrete actions like 'design component hierarchies', 'implement caching strategies', 'structure API calls' instead of just category names
Expand trigger terms to include common user language like 'React', 'Vue', 'Redux', 'hooks', 'props', 'SPA', 'single page app', 'rendering'
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Names the domain (frontend architecture) and lists some actions (state management, components, data fetching), but these are high-level categories rather than concrete specific actions like 'create reducers' or 'implement caching strategies'. | 2 / 3 |
Completeness | Clearly answers both what (framework-agnostic frontend architecture covering state management, components, data fetching) and when (building any web frontend, choosing state patterns, structuring UI code) with an explicit 'Use when' clause. | 3 / 3 |
Trigger Term Quality | Includes some relevant terms like 'frontend', 'state management', 'components', 'UI code', but misses common variations users might say like 'React', 'Vue', 'Redux', 'hooks', 'props', 'rendering', or 'SPA'. | 2 / 3 |
Distinctiveness Conflict Risk | While 'frontend architecture' provides some specificity, terms like 'components' and 'state management' could overlap with framework-specific skills or general programming skills. The 'framework-agnostic' qualifier helps but doesn't fully eliminate conflict risk. | 2 / 3 |
Total | 9 / 12 Passed |
Implementation
72%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill is well-structured and concise, respecting token efficiency with clear principles and appropriate references to external documentation. However, it lacks concrete, executable examples—no code snippets demonstrating state management patterns, component structures, or data fetching implementations. The workflow is too generic to guide complex frontend architecture decisions effectively.
Suggestions
Add concrete code examples for at least one state management pattern (e.g., local state lifting, context usage) to improve actionability
Include a specific example of feature-based folder structure to make the 'organize by feature' principle executable
Add validation criteria to the workflow (e.g., 'verify state boundaries don't create prop drilling beyond 2 levels') to improve workflow clarity
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The content is lean and efficient, with principles stated as brief, actionable bullets. No unnecessary explanations of concepts Claude already knows. | 3 / 3 |
Actionability | Principles are clear but abstract—no concrete code examples, specific commands, or executable patterns. The guidance describes what to do conceptually but lacks copy-paste ready implementations. | 2 / 3 |
Workflow Clarity | The 3-step workflow is present but generic and lacks validation checkpoints. No concrete verification steps or feedback loops for catching errors in frontend architecture decisions. | 2 / 3 |
Progressive Disclosure | Good structure with clear reference to external rules file. Content is appropriately brief with one-level-deep navigation to detailed patterns. | 3 / 3 |
Total | 10 / 12 Passed |
Validation
90%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 10 / 11 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
metadata_field | 'metadata' should map string keys to string values | Warning |
Total | 10 / 11 Passed | |
7b466be
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.