CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

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

88%

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

SKILL.md
Quality
Evals
Security

Quality

Content

86%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 well-structured, highly actionable patterns skill: correct Nuxt 4 idioms in executable snippets, tight organization, and a closing review checklist that anchors verification. Weaknesses are minor — a few bullets restate known concepts (route-rule definitions) and there is no explicit step-by-step remediation workflow for the debugging scenarios it targets.

Suggestions

Trim the route-rules option definitions to only the non-obvious semantics (e.g. drop 'prerender: static HTML at build time') to gain the last conciseness point.

Add a short ordered sequence for the debugging trigger, e.g. 'When fixing a hydration mismatch: 1) reproduce on the client, 2) isolate the non-deterministic source, 3) re-verify with the Review Checklist', to convert the checklist into an explicit feedback loop.

DimensionReasoningScore

Conciseness

The body is lean and Nuxt-specific with no general concept padding, but the route-rules option list ('prerender: static HTML at build time', 'swr: serve cached content and revalidate in the background') restates concepts Claude already knows — a minor trim opportunity that keeps it below the every-token-earns-its-place 5 anchor.

4 / 5

Actionability

Copy-paste-ready, Nuxt-4-idiomatic snippets cover the common cases: function-style keyed useAsyncData with $fetch, useFetch with lazy/server options, a complete routeRules config block, and Lazy-prefixed components with hydrate-on-visible; composables are auto-imported so snippets are complete in context.

5 / 5

Workflow Clarity

Sections are organized by concern and close with an explicit Review Checklist acting as verification checkpoints, but as a patterns/reference skill it offers no explicit diagnose-then-fix sequence or error-recovery loop, placing it between the 4 and 5 anchors.

4 / 5

Progressive Disclosure

No bundle files exist and none are needed: at ~90 lines all content is appropriately inline, sections are clearly headed and ordered from activation triggers to solutions to a checklist, which per the rubric's simple-skill note merits the top anchor.

5 / 5

Total

18

/

20

Passed

Description

87%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 description that states concrete capabilities with named Nuxt APIs and gives an explicit, naturally worded 'Use when...' trigger clause covering build, review, and debugging scenarios. Its only shortcoming is phrasing capabilities as topic areas rather than verb actions and omitting a few natural synonyms.

DimensionReasoningScore

Specificity

Names the domain plus five concrete areas ('hydration safety, performance, route rules, lazy loading, and SSR-safe data fetching with useFetch and useAsyncData') with specific API names, but phrases them as topic areas rather than verb-driven actions, so it falls just short of the comprehensive multi-action 5 anchor.

4 / 5

Completeness

Explicitly answers both 'what' (Nuxt 4 app patterns for the listed areas) and 'when' ('Use when building or reviewing a Nuxt 4 app, or debugging hydration mismatches and SSR-safe data fetching') with concrete trigger phrases, matching the top anchor.

5 / 5

Trigger Term Quality

Includes natural phrases users would say ('building or reviewing a Nuxt 4 app', 'debugging hydration mismatches', 'SSR-safe data fetching') plus API keywords, but misses a few natural synonyms and file-related terms (e.g. 'Vue', spelled-out 'server-side rendering', '.vue').

4 / 5

Distinctiveness Conflict Risk

'Nuxt 4' pins a clear niche with distinct, framework-specific triggers (hydration mismatches, useFetch/useAsyncData, route rules); only trivial overlap with a generic Vue skill, so conflict risk is minimal.

5 / 5

Total

18

/

20

Passed

Validation

93%

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

CriteriaDescriptionResult

metadata_version

'metadata.version' is missing

Warning

Total

15

/

16

Passed

Repository

affaan-m/ECC

Path

skills/nuxt4-patterns/SKILL.md

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.