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.

90

1.24x
Quality

88%

Does it follow best practices?

Impact

98%

1.24x

Average score across 3 eval scenarios

SecuritybySnyk

Passed

No known issues

SKILL.md
Quality
Evals
Security

Quality

Content

77%

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

This is a high-quality, comprehensive skill that provides excellent actionable guidance for Next.js 16 static-first architecture. Its greatest strengths are the executable code examples, clear decision matrices, and thorough failure mode documentation. The main weakness is its length — at ~400 lines with no supporting bundle files, it could benefit from splitting reference material (cache mechanics, RSC rules, migration guide) into separate files to improve token efficiency.

Suggestions

Extract the Cache Components Setup, RSC Boundary Rules, and Migration sections into separate referenced files (e.g., CACHE_REFERENCE.md, RSC_RULES.md, MIGRATION.md) to reduce the main skill's token footprint.

Remove explanations of concepts Claude already knows, such as 'Client components cannot be async' and the non-serializable props table — these are standard RSC knowledge that can be trimmed to brief reminders or omitted entirely.

DimensionReasoningScore

Conciseness

The skill is comprehensive and mostly efficient, but includes some sections that explain concepts Claude likely already knows (e.g., RSC boundary rules, async client components being invalid, non-serializable props). The migration table and cache mechanics sections are valuable but could be tighter. Some sections like 'Why This Works' bullet points add modest value.

2 / 3

Actionability

Excellent actionability throughout — every pattern includes fully executable TypeScript/TSX code examples, concrete configuration snippets (next.config.ts), specific API calls (cacheLife, cacheTag, updateTag), and clear before/after migration examples. The code is copy-paste ready and covers real-world scenarios.

3 / 3

Workflow Clarity

The implementation sequence provides a clear 8-step workflow. The Entry + Static + Slots pattern is well-sequenced with explicit validation via the PR Acceptance Criteria checklist. The 'Common Failure Modes + Fixes' section serves as an effective error recovery guide. Decision trees and checklists provide clear branching logic.

3 / 3

Progressive Disclosure

The content is well-organized with clear section headers and logical grouping, but it's a monolithic ~400-line document with no references to external files. Several sections (Cache Components Setup, RSC Boundary Rules, Async Patterns) could be split into separate reference files to keep the main skill leaner. No bundle files are provided to offload detail.

2 / 3

Total

10

/

12

Passed

Description

100%

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 is an excellent skill description that hits all the marks. It provides specific concrete capabilities, comprehensive trigger terms including both technical jargon and natural problem descriptions (e.g., 'route goes dynamic unexpectedly'), explicit 'Use when' and 'Triggers on' clauses, and a clearly defined niche that distinguishes it from general Next.js or React skills. The description is thorough without being padded, and uses proper third-person voice throughout.

DimensionReasoningScore

Specificity

Lists multiple specific concrete actions and patterns: cached shells with dynamic slots, provider islands, 'use cache' boundaries, link preloading strategy, splitting entry vs static renderers, scoping client providers, and tuning prefetch behavior.

3 / 3

Completeness

Clearly answers both 'what' (static-first Next.js 16 architecture patterns with specific techniques listed) and 'when' (explicit 'Use when...' clause covering multiple scenarios, plus a 'Triggers on...' clause with specific trigger terms).

3 / 3

Trigger Term Quality

Excellent coverage of natural terms users would say, including both technical terms ('use cache pattern', 'dynamic slots', 'provider island', 'prefetch strategy') and problem-oriented phrases ('route goes dynamic unexpectedly'). Also includes the framework name 'Next.js' and version '16'.

3 / 3

Distinctiveness Conflict Risk

Highly distinctive niche focusing specifically on static-first architecture patterns in Next.js 16 with 'use cache' boundaries and dynamic slots. The specificity of the version, the architectural patterns, and the trigger terms make it very unlikely to conflict with general Next.js or React skills.

3 / 3

Total

12

/

12

Passed

Validation

81%

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

Validation9 / 11 Passed

Validation for skill structure

CriteriaDescriptionResult

skill_md_line_count

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

Warning

frontmatter_unknown_keys

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

Warning

Total

9

/

11

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.