preact/compose-with-tanstack-pacer
OfficialDebounce filters and throttle resize for smooth tables
Software Engineering#preact#throttle#debounce#tanstack-table#column resizing#filtering performance#preact-pacer
AuthorTanStack
Version1.0.0
Installs0
System Documentation
What problem does it solve?
It prevents interactive Preact tables from becoming janky when filter typing or column resizing triggers too many expensive row-model recomputations.
Core Features & Use Cases
- Debounced filter writes: Debounce column.setFilterValue (and optionally global filtering) so the table recomputes on the trailing edge instead of every keystroke.
- Throttled resize writes: Throttle table.setColumnSizing updates during pointer-move so resizing stays responsive without rerunning the full layout every pixel.
- Correct interaction pattern: Keep immediate UI responsiveness with local state while debouncing only the write to the table.
Quick Start
Install @tanstack/preact-pacer and wrap your filter input updates with useDebouncedCallback and your resize updates with useThrottledCallback so table recomputation happens less frequently while the UI remains smooth.
Dependency Matrix
Required Modules
@tanstack/preact-pacer
Components
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: preact/compose-with-tanstack-pacer Download link: https://github.com/TanStack/table/archive/main.zip#preact-compose-with-tanstack-pacer Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.