CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

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.

76

Quality

95%

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

100%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 dense, high-signal skill body: it assumes Claude's general knowledge and spends every token on the repo's non-obvious gotchas (void preload semantics, imperative fetching ignoring enabled: false, skipToken errors, select handling, SuperJSON dependency), with a fully executable example. No changes needed.

DimensionReasoningScore

Conciseness

Every bullet carries non-obvious, repo-specific knowledge (void preload rejection semantics, skipToken producing a missing-query-function error, the SuperJSON/pending-dehydration dependency in trpc/query-client.ts) with zero padding and no explanation of concepts Claude already knows. Anchor 4's 'minor instances of over-explanation' does not apply — nothing here could be trimmed without losing information.

5 / 5

Actionability

The snippet is complete and copy-paste ready (exact imports from @/trpc/preload-query and @/trpc/server, real procedure trpc.settings.getModelPreferences), and the bullets give executable API shapes for both normal (queryClient.query(trpc.foo.bar.queryOptions(...))) and infinite queries (infiniteQueryOptions with cursor and getNextPageParam). This matches 'fully executable; specific examples cover the common cases' — including guarding conditionals — with no pseudocode.

5 / 5

Workflow Clarity

This is a single-purpose pattern skill (~24 lines) and the core action is unambiguous: get the request-cached client, void the preload, render consumers beneath the matching hydration boundary, preserving awaited settings preloads and isolated clients. The rubric's simple-skill exception applies and there is no destructive or batch operation, so the workflow-clarity cap for missing validation does not apply.

5 / 5

Progressive Disclosure

The skill is under 50 lines with no need for external references (none of references/, scripts/, assets/ exist), organized as prose, bullets, a code example, and a dependency caveat. Per the rubric guideline for short skills without external references, well-organized structure alone merits the top score; the one file mention (trpc/query-client.ts) is an in-repo path, not a broken bundle reference.

5 / 5

Total

20

/

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 with an explicit 'Use when' clause and concrete, niche-specific triggers that a developer working in apps/chat would naturally use. Only minor gains available from adding common trigger synonyms.

DimensionReasoningScore

Specificity

Concrete phrases like 'lazy-prefetch pattern without blocking server rendering', 'prefetching tRPC queries in Next.js Server Components', and 'changing query dehydration and hydration behavior' name the domain and several specific behaviors, matching anchor 4 ('several specific actions; minor gaps'). It falls short of anchor 5 because the what-clause names the pattern rather than enumerating its full set of concrete actions.

4 / 5

Completeness

It explicitly answers what ('Use the ChatJS React Query v5 lazy-prefetch pattern without blocking server rendering') and when with a concrete 'Use when' clause covering both trigger scenarios (prefetching tRPC queries in Server Components, changing dehydration/hydration behavior in apps/chat). This matches anchor 5's both-what-and-when with concrete trigger phrases; anchor 4's 'when could be more explicit' does not apply.

5 / 5

Trigger Term Quality

Good natural-keyword coverage: 'React Query v5', 'prefetching tRPC queries', 'Next.js Server Components', 'dehydration and hydration'. It sits at anchor 4 rather than 5 because common variations a user might say — 'RSC', 'server-side prefetch', 'SSR', 'query cache' — are missing.

4 / 5

Distinctiveness Conflict Risk

The niche is sharply defined — lazy-prefetch + tRPC + Server Components + apps/chat hydration behavior — so it would not trigger for unrelated React Query or Next.js skills. Minimal conflict risk, matching anchor 5.

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.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository

FranciscoMoretti/chat-js

Path

.agents/skills/lazy-prefetch-pattern/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.