CtrlK
BlogDocsLog inGet started
Tessl Logo

nextjs-static-shells

Static-first Next.js 16 architecture patterns: cached shells with dynamic slots, provider islands, 'use cache' boundaries, and link preloading strategy. Use when building or refactoring Next.js routes to maximize static rendering, implementing 'use cache' with dynamic personalization, splitting entry vs static renderers, scoping client providers, or tuning prefetch behavior. Triggers on 'static shell', 'use cache pattern', 'dynamic slots', 'provider island', 'prefetch strategy', 'static first', 'cache boundary', 'route goes dynamic unexpectedly', or any Next.js architecture work involving mixed static/dynamic rendering.

70

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

77%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.

The body is exceptionally actionable — dense, correct, copy-adaptable code with real Next.js 16 APIs, a clear implementation sequence, and strong failure-mode recovery guidance. Its weaknesses are length and monolithic structure: general RSC knowledge is re-taught inline, and reference-grade material (migration tables, RSC boundary rules) is not split into bundle files.

Suggestions

Move stable reference material — 'Migration from Previous Versions' and the RSC boundary/serializable-props tables — into a references/ file (e.g. references/migration.md) and keep only a one-line pointer plus the Next.js 16-specific deltas in SKILL.md.

Trim or cut sections that re-teach general React/Next.js knowledge Claude already has: 'Async Client Components Are Invalid', the non-serializable props table, the Promise.all waterfall example, and React.use() for params.

Consider moving the 'Cache Components Setup & Mechanics' API detail (cacheLife profiles, scope levels, cache-key generation) into a reference file, keeping only the decision table and the banned-inside-'use-cache' rules inline.

DimensionReasoningScore

Conciseness

The Next.js 16-specific material (cacheLife profiles, cacheComponents, updateTag vs revalidateTag, cache key derivation) is efficient, but several sections re-teach knowledge Claude already has — 'Async Client Components Are Invalid', the serializable-props table, Promise.all waterfalls, and React.use() for params. This matches 'mostly efficient but includes some unnecessary explanation or could be tightened'; it is not 4 because the generic RSC sections are a substantial, clearly removable chunk of the ~580 lines.

3 / 5

Actionability

Nearly every section carries complete-syntax, concrete TSX using the real APIs: next.config.ts setup, all three 'use cache' scope levels, cacheLife inline config with actual values, cacheTag/updateTag/revalidateTag flows, and a full unstable_cache migration before/after. Only data-layer helper names (getStaticData, db.*) are illustrative, and coverage spans the common cases, matching the anchor-5 example.

5 / 5

Workflow Clarity

An 8-step 'Implementation Sequence' ending in 'Measure before/after (TTFB, shell paint, nav latency, prefetch traffic)', a 'PR Acceptance Criteria' checklist, and eight 'Common Failure Modes + Fixes' with cause→fix pairs provide an explicit sequence, validation checkpoints, and error-recovery feedback loops.

5 / 5

Progressive Disclosure

The body is a well-headered ~580-line monolith with zero references to bundle files, and no references/ or scripts/ files exist in the skill bundle. Sections like 'RSC Boundary Rules' and 'Migration from Previous Versions' are reference material that clearly belongs in separate files, matching 'content that should be separate is inline'. It is not 2 because section structure and navigation within the file are good; it is not 4 because nothing at all is split out despite the length.

3 / 5

Total

16

/

20

Passed

Description

96%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: concrete capabilities, explicit use-when guidance, and a rich set of natural trigger phrases including failure-mode phrasing users would actually say. The only weakness is the broad 'any Next.js architecture work' catch-all, which slightly raises conflict risk with general Next.js skills.

DimensionReasoningScore

Specificity

The description enumerates multiple concrete capabilities ('cached shells with dynamic slots, provider islands, 'use cache' boundaries, and link preloading strategy') and concrete actions ('implementing 'use cache' with dynamic personalization, splitting entry vs static renderers, scoping client providers, or tuning prefetch behavior'), covering the skill comprehensively rather than with minor gaps.

5 / 5

Completeness

It explicitly answers 'what' (static-first Next.js 16 architecture patterns, each enumerated) and 'when' via both a 'Use when building or refactoring Next.js routes...' clause and a 'Triggers on...' clause with concrete trigger phrases, matching the anchor-5 example structure.

5 / 5

Trigger Term Quality

It lists nine explicit trigger phrases including natural problem statements users would say ('route goes dynamic unexpectedly', 'static first', 'prefetch strategy') alongside pattern-name synonyms ('static shell', 'use cache pattern', 'cache boundary'), giving comprehensive natural-term coverage. It is not a 4 because both the pattern vocabulary and the colloquial failure phrasings are present with variations.

5 / 5

Distinctiveness Conflict Risk

The Next.js 16 caching/static-rendering niche is distinct with specific triggers, but the closing catch-all 'or any Next.js architecture work involving mixed static/dynamic rendering' is broad enough to overlap with general Next.js development skills. It is not 5 because of that catch-all; it is above 3 because the core triggers are highly specific to this skill's domain.

4 / 5

Total

19

/

20

Passed

Validation

87%

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

Validation — 14 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

skill_md_line_count

SKILL.md is long (593 lines); consider splitting into references/ and linking

Warning

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

14

/

16

Passed

Repository
joelhooks/joelclaw
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.