preact/compose-with-tanstack-pacer

To debounce filter inputs in a Preact table, wrap column.setFilterValue with useDebouncedCallback from @tanstack/preact-pacer. This delays the table row-model recomputation until typing stops, keeping local UI state responsive while preventing janky renders.

Column resizing causes performance issues because pointer-move events trigger continuous table.setColumnSizing updates, forcing expensive layout recomputations on every pixel. Throttling these writes limits the recomputation frequency, maintaining smooth visual feedback without overloading the render cycle.

The best way to throttle column resizing is using useThrottledCallback from @tanstack/preact-pacer on table.setColumnSizing. This restricts the expensive row-model recomputations to fixed intervals during pointer-move events, keeping table resizing responsive without rerunning layout every pixel.

Yes, you can use @tanstack/preact-pacer to improve filtering performance without losing feedback by keeping local UI state for immediate visual updates while exclusively debouncing the write path to column.setFilterValue, ensuring the heavy row-model recomputation only runs on the trailing edge.

Debounce writes for high-frequency text input scenarios like filtering so recomputations run only after typing pauses. Throttle writes for continuous pointer-driven actions like column resizing so row-model updates occur at controlled intervals, preventing layout thrashing while dragging.