nuxt4-patterns

Nuxt 4 app patterns for hydration safety, performance, route rules, lazy loading, and SSR-safe data fetching with useFetch and useAsyncData. Use when building or reviewing a Nuxt 4 app, or debugging hydration mismatches and SSR-safe data fetching.

Quality

96%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Quality

Content

93%Weight 40%Scale 1-5

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

A tight, well-organized patterns skill with executable examples and clear section navigation. The only gap is the absence of an explicit validate-fix-retry feedback loop, which caps workflow clarity at 4.

Suggestions

Add a short feedback loop to the Review Checklist (e.g., 'If a mismatch reappears after a fix, re-verify server and client render the same markup before moving on') to reach full workflow clarity.

Optionally mark the Review Checklist items as ordered verification steps rather than a flat bullet list to make the review sequence explicit.

Dimension	Reasoning	Score
Conciseness	Lean bullet-driven body that assumes Claude's competence — no 'Nuxt is a Vue framework' preamble, no padded explanations; every section earns its tokens.	5 / 5
Actionability	Provides executable, copy-paste-ready examples for useAsyncData/useFetch, routeRules config, and Lazy component hydration, plus specific API guidance (pick, server: false, hydrate-on-visible).	5 / 5
Workflow Clarity	A 'Review Checklist' supplies explicit validation checkpoints for reviewing, but there is no error-recovery feedback loop (validate -> fix -> retry), keeping it just below 5.	4 / 5
Progressive Disclosure	Self-contained patterns overview organized into clearly headed one-level sections with no nested references; splitting into bundle files would be unnecessary for this scope.	5 / 5
	Total	19 / 20 Passed

Description

100%Weight 40%Scale 1-5

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

A strong, specific description that names concrete APIs and capability areas, provides explicit 'Use when' triggers with synonyms, and occupies a distinct niche. Third-person voice is maintained throughout.

Dimension	Reasoning	Score
Specificity	Lists multiple concrete capability areas — 'hydration safety, performance, route rules, lazy loading, and SSR-safe data fetching with useFetch and useAsyncData' — naming specific APIs, not vague abstractions.	5 / 5
Completeness	Explicitly answers both 'what' (patterns for the listed concerns) and 'when' ('Use when building or reviewing a Nuxt 4 app, or debugging hydration mismatches and SSR-safe data fetching').	5 / 5
Trigger Term Quality	Covers natural phrases a Nuxt user would say — 'building or reviewing a Nuxt 4 app', 'hydration mismatches', 'SSR-safe data fetching' — including synonyms (hydration safety / mismatches).	5 / 5
Distinctiveness Conflict Risk	Scoped to a clear niche (Nuxt 4 SSR/hydration/route-rules/data-fetching) with specific triggers, minimal overlap risk with unrelated skills.	5 / 5
	Total	20 / 20 Passed

Validation

93%

Warnings & errors only

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 15 / 16 Passed

Validation for skill structure

Criteria	Description	Result
metadata_version	'metadata.version' is missing	Warning

	Total	15 / 16 Passed

Repository: affaan-m/ECC
Path: skills/nuxt4-patterns/SKILL.md
Commit: d8409a4

Reviewed: 1 day ago

Table of Contents

Discovery Implementation Validation

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.