skills.rest
Montte-erp
Montte-erpOFFICIAL
Explore all skills by this author →
GitHub

tanstack-virtual

Virtualize large lists with useVirtualizer to render only visible items.

6|4|Updated Nov 1, 2025
Search Tags:#react#tanstack#angular#vue#virtualization#frontend-performance#virtualizer
One-click install
npx skills add https://github.com/Montte-erp/montte-nx --skill tanstack-virtual-montte-erp
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tanstack-virtual
Source: https://github.com/Montte-erp/montte-nx/tree/main/.agents/skills/tanstack-virtual
Command: npx skills add https://github.com/Montte-erp/montte-nx --skill tanstack-virtual-montte-erp

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Efficiently renders only visible items in large lists, grids, and tables to reduce DOM size and improve scroll performance.

Core Features & Use Cases

  • Virtualization logic that calculates visible items and positions them with absolute positioning
  • Supports multiple frameworks via TanStack Virtual core: React, Vue, Solid, Svelte, Lit, Angular
  • Handles dynamic heights, horizontal layouts, and grid-like scenarios for massive datasets

Quick Start

Install @tanstack/virtual and integrate useVirtualizer to render only visible items in your list.

Frequently Asked Questions about tanstack-virtual

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I render large lists in React without dropping scroll performance?▼

Virtualization renders only visible items in large lists to reduce DOM size and improve scroll performance. It calculates visible items and positions them with absolute positioning to maintain 60FPS scrolling in React applications.

Does TanStack Virtual support frameworks other than React for list virtualization?▼

TanStack Virtual supports list virtualization across React, Vue, Solid, Svelte, Lit, and Angular. It provides framework-agnostic core logic to calculate visible items and position them for efficient scrolling in any supported framework.

Can I virtualize lists with dynamic item heights in frontend applications?▼

Dynamic item heights are supported in virtualized lists using TanStack Virtual. The virtualizer handles dynamic measurements alongside the count, getScrollElement, and estimateSize API requirements to accurately position variable-height items during scroll.

What is the best way to virtualize large grids and tables with horizontal layouts?▼

Virtualizing large grids and tables is best handled by applying horizontal layout modes in TanStack Virtual. It supports both vertical and horizontal orientations to efficiently render massive datasets in grid-like scenarios.

Why does my frontend application lag when scrolling massive datasets in a table?▼

Frontend applications lag during scroll because rendering massive datasets creates an excessively large DOM. Virtualization solves this by calculating and rendering only the visible items, applying absolute positioning to maintain smooth 60FPS performance.

Do I need to specify an estimated size when using a virtualizer for large lists?▼

Specifying an estimated size is required when using a virtualizer for large lists. The estimateSize parameter, along with count and getScrollElement, satisfies the core API usage requirements needed to calculate visible item positioning.

Related Skills

Explore More Software Engineering Skills→
harlan-zwharlan-zw
174

tanstack-vue-virtual-skilld

Virtualize scrollable Vue.js lists with @tanstack/vue-virtual for visible items only.

Community
Intermediate
TanStackTanStack
28.3k

solid/compose-with-tanstack-virtual

Virtualize large @tanstack/solid-table datasets by rendering only visible rows.

Official
Intermediate
TaherMustansir1929TaherMustansir1929

tanstack-virtual

Virtualize large lists and grids to render only visible items.

Community
Intermediate
TanStackTanStack
28.3k

vue/compose-with-tanstack-virtual

Compose TanStack Vue Table with TanStack Virtual for row and column virtualization.

Official
Advanced