CtrlK
BlogDocsLog inGet started
Tessl Logo

lazy-prefetch-pattern

Use the ChatJS React Query v5 lazy-prefetch pattern without blocking server rendering. Use when prefetching tRPC queries in Next.js Server Components or changing query dehydration and hydration behavior in apps/chat.

71

Quality

86%

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 concise, well-organized body that gives concrete executable guidance for a single-purpose pattern with no unnecessary padding. The main gap is the absence of a complete copy-pasteable example block with imports.

Suggestions

Add a short copy-pasteable code block showing the import and full prefetch usage so the common case is fully executable without inference.

Optionally include a one-line example of awaiting only the required pre-render data to make that bullet as concrete as the prefetch bullet.

DimensionReasoningScore

Conciseness

Lean and efficient with no padding or re-explanation of concepts Claude already knows; every line (the prefetch helper, await-only-required rule, render boundary, dependency note) earns its place.

5 / 5

Actionability

Provides a concrete executable call `prefetch(trpc.foo.bar.queryOptions(...))` and names specific helpers (`@/trpc/server`, `HydrateClient`/`HydrationBoundary`, `trpc/query-client.ts`), but lacks a complete copy-pasteable import/usage block covering common cases.

4 / 5

Workflow Clarity

Three clearly ordered steps (prefetch early without awaiting, await only required data, render through the boundary) with a dependency caveat; no validation checkpoint is needed for this non-destructive rendering pattern.

4 / 5

Progressive Disclosure

Under 50 lines with no bundle files required; content is well-organized into a heading, a one-line summary, bulleted steps, and a dependency note, satisfying the simple-skill exception for progressive disclosure.

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 tightly scoped, well-structured description that answers both what and when with concrete, domain-appropriate trigger phrases. Minor room to broaden trigger-term synonyms, but conflict risk is low and specificity is strong.

DimensionReasoningScore

Specificity

Names the concrete lazy-prefetch pattern, the React Query v5 / tRPC / Next.js Server Components domain, and specific behaviors (prefetching queries, dehydration/hydration); stops short of fully comprehensive coverage of every variant.

4 / 5

Completeness

Clearly states what the skill does ('use the lazy-prefetch pattern without blocking server rendering') and gives an explicit 'Use when...' clause with concrete trigger scenarios, satisfying both what and when.

5 / 5

Trigger Term Quality

Uses natural domain terms a developer would say ('prefetching tRPC queries', 'Server Components', 'dehydration and hydration', 'server rendering'); a few synonyms or file-level triggers are absent.

4 / 5

Distinctiveness Conflict Risk

Scoped to a very specific niche (ChatJS apps/chat, React Query v5 lazy-prefetch, tRPC, Next.js Server Components) with distinct triggers and minimal overlap risk.

5 / 5

Total

18

/

20

Passed

Validation

100%

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

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
FranciscoMoretti/chat-js
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.