CtrlK
BlogDocsLog inGet started
Tessl Logo

tanstack-virtual

Headless UI for virtualizing large element lists at 60FPS in TS/JS, React, Vue, Solid, Svelte, Lit & Angular.

56

Quality

62%

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

Fix and improve this skill with Tessl

tessl review fix ./.agents/skills/tanstack-virtual/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

71%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 a dense, accurate, and highly actionable reference with excellent practical warnings in Best Practices and Common Pitfalls, and nearly all code is executable. Its main weaknesses are the absence of any progressive-disclosure structure (everything inlined in a ~370-line SKILL.md) and a few fragmentary code examples that leave the reader mid-implementation.

Suggestions

Move the exhaustive Virtualizer Options table, Virtualizer API, and VirtualItem interface into a references/api.md file, keeping SKILL.md to the core pattern, dynamic sizing, and pointers.

Complete the fragmentary examples: finish the Infinite Scrolling render block (including the loader row) and give the Sticky Items section a real render snippet instead of a trailing comment.

Add per-framework entry points (@tanstack/vue-virtual, @tanstack/solid-virtual, etc.) or a short note on where to find them, since the description promises six frameworks but every example is React-only.

DimensionReasoningScore

Conciseness

The body is code-first and dense with no explanations of concepts Claude already knows (no "what is virtualization" padding), and inline comments carry high-value warnings like "// REQUIRED for measurement" and "// Do NOT set fixed height". It is not 5 because the exhaustive 17-row options table and full Virtualizer API listing are bulk reference material that pushes the file past a lean token budget and could be trimmed or offloaded.

4 / 5

Actionability

The Core Pattern, Dynamic Heights, Grid, Window Scrolling, and Sticky sections contain complete copy-paste-ready TSX with all required options shown. It is not 5 because a few snippets are fragments: the Infinite Scrolling example ends at a comment ("// Render virtual items, show loader row..."), the Smooth Scrolling example references an undeclared parentRef, and the Sticky section's rendering is only a comment.

4 / 5

Workflow Clarity

The Core Pattern is an unambiguous single recipe and the Best Practices / Common Pitfalls sections act as an error-avoidance checklist (e.g. "Forgetting to subtract scrollMargin from translateY in window scrolling"). It is not 5 because there are no explicit validation checkpoints or feedback loops for the trickier multi-step setups (dynamic measurement, infinite scroll fetch triggering), and not 3 because steps that do exist are concrete and correctly ordered rather than implicit.

4 / 5

Progressive Disclosure

Sections are well-labeled and logically ordered, but no references/ bundle exists and roughly 200 lines of API material (the exhaustive options table, Virtualizer API, and VirtualItem interface) that clearly belongs in a separate reference file is inlined in SKILL.md. This matches anchor 3 'some structure but could be better organized; content that should be separate is inline', and does not qualify for the under-50-lines simple-skill exception.

3 / 5

Total

15

/

20

Passed

Description

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

The description is concise, technically accurate, and distinct via its framework list, but it describes only the library's identity rather than the concrete jobs it performs, and it has no 'Use when...' trigger guidance. Adding explicit trigger scenarios and a broader action list would substantially improve discoverability.

Suggestions

Add an explicit trigger clause, e.g. "Use when rendering large lists, grids, or tables that cause lag or high DOM node counts, or when implementing infinite scroll/windowing."

Mention concrete capability keywords users would naturally say: virtual lists, dynamic/variable row heights, grid virtualization, infinite scrolling, 10k+ rows.

Note the other framework entry points (e.g. @tanstack/vue-virtual, @tanstack/svelte-virtual) or a generic phrasing so the description triggers for non-React users too.

DimensionReasoningScore

Specificity

"virtualizing large element lists" names the domain and one concrete action, and the framework list narrows scope, but there is no enumeration of several specific capabilities (grids, tables, dynamic sizing, scroll APIs are unmentioned). This matches the anchor 'names domain and 1-2 concrete actions, but not comprehensive', and falls short of anchor 4 which expects several listed actions.

3 / 5

Completeness

The description has a clear "what" (virtualizing large element lists) but entirely lacks a "Use when..." or equivalent trigger clause, capping completeness at 3 per the judging guidelines. It is not score 2 because the "what" is specific rather than vague, and not 4 because no "when" guidance exists even implicitly.

3 / 5

Trigger Term Quality

Terms like "virtualizing", "large element lists", and the framework names are relevant, but common natural phrasings users would say are missing: "virtual list", "windowing", "infinite scrolling", "long list performance", "laggy scrolling". This matches the anchor 'some relevant keywords but missing common variations or synonyms', and does not reach anchor 4's 'good keyword coverage'.

3 / 5

Distinctiveness Conflict Risk

The explicit framework enumeration (React, Vue, Solid, Svelte, Lit & Angular) plus the virtualization niche make this clearly distinguishable from unrelated skills, matching anchor 4 'mostly distinct; minor overlap risk'. It is not 5 because "Headless UI" is a generic term shared with component-library skills and no trigger phrases sharpen the boundary.

4 / 5

Total

13

/

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
udecode/plate
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.