A counter looks simple until it starts moving.
Then the hidden problems show up: React re-renders, jumping digits, awkward formatting, and screen readers hearing the animation instead of the result.
Better Counter is built for those hidden parts. It animates through browser animation frames and direct text updates, keeps digits stable, formats the final value, and gives screen readers one clean result.
Built for stats, prices, percentages, and metrics that need clean motion without the mess around it.
No React re-render loop
The visual number updates with browser animation frames and direct text changes, so React does not re-render every count step.
Digits stay stable
Hidden ghost values reserve width, while padding, grouping, decimals, prefixes, suffixes, and tabular numbers are handled from the controls.
Screen readers get one value
The animated number is hidden from assistive tech, while a separate value exposes the final formatted number.
Motion respects context
Static render, reduced motion, above-fold final mode, and viewport-triggered animation are handled.
Good fit: stats, prices, percentages, and metrics that need clean motion.
Wrong fit: odometers, show-off animations, or full dashboards.
Questions about setup, product, or licensing: alexandre@mash.supply
A counter looks simple until it starts moving.
Then the hidden problems show up: React re-renders, jumping digits, awkward formatting, and screen readers hearing the animation instead of the result.
Better Counter is built for those hidden parts. It animates through browser animation frames and direct text updates, keeps digits stable, formats the final value, and gives screen readers one clean result.
Built for stats, prices, percentages, and metrics that need clean motion without the mess around it.
No React re-render loop
The visual number updates with browser animation frames and direct text changes, so React does not re-render every count step.
Digits stay stable
Hidden ghost values reserve width, while padding, grouping, decimals, prefixes, suffixes, and tabular numbers are handled from the controls.
Screen readers get one value
The animated number is hidden from assistive tech, while a separate value exposes the final formatted number.
Motion respects context
Static render, reduced motion, above-fold final mode, and viewport-triggered animation are handled.
Good fit: stats, prices, percentages, and metrics that need clean motion.
Wrong fit: odometers, show-off animations, or full dashboards.
Questions about setup, product, or licensing: alexandre@mash.supply