# @solid-primitives/timer
> Primitives to manage timeout and interval
Latest version **1.4.4** (published 2026-02-21) · MIT license · 0 weekly downloads
## Install
```sh
npm install @solid-primitives/timer
pnpm add @solid-primitives/timer
yarn add @solid-primitives/timer
bun add @solid-primitives/timer
```
## Health
**Score 65/100 (B)** — status: stable.
Positive: has types; esm support; no vulnerabilities; high maintenance score; high quality score.
Warnings: low downloads.
## Facts
| | |
|---|---|
| Version | 1.4.4 |
| Published | 2026-02-21 |
| First published | 2021-07-17 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM |
| Dependencies | 0 |
| Unpacked size | 14.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1558 |
| Author | David Di Biase |
| Maintainers | davedbase, lexlohr, thetarnav. |
| Keywords | setInterval, setTimeout, timer, solid, primitives |
## Links
- npm: https://www.npmjs.com/package/@solid-primitives/timer
- Repository: https://github.com/solidjs-community/solid-primitives
- Homepage: https://primitives.solidjs.community/package/timer
- Issues: https://github.com/solidjs-community/solid-primitives/issues
- npm.io page: https://npm.io/package/@solid-primitives/timer
## Alternatives
- [@sindresorhus/slugify](https://npm.io/package/@sindresorhus/slugify.md) — 3.7M weekly downloads
- [solid-js](https://npm.io/package/solid-js.md) — 2.7M weekly downloads
- [expo-glass-effect](https://npm.io/package/expo-glass-effect.md) — 2.5M weekly downloads
- [nanoassert](https://npm.io/package/nanoassert.md) — 780.8K weekly downloads
- [@ffmpeg/ffmpeg](https://npm.io/package/@ffmpeg/ffmpeg.md) — 529.5K weekly downloads
## Recent versions
- 1.4.4 (latest) — 2026-02-21
- 1.4.5-next.1 (next) — 2026-08-12
- 1.4.5-next.0 — 2026-07-18
- 1.4.3 — 2025-08-28
- 1.4.2 — 2025-06-29
- 1.4.1 — 2025-04-27
- 1.4.0 — 2025-01-22
- 1.3.10 — 2024-09-09
- 1.3.9 — 2024-03-05
- 1.3.8 — 2024-01-16
- 1.3.7 — 2023-03-23
- 1.3.6 — 2023-02-28
- 1.3.5 — 2023-01-18
- 1.3.4 — 2022-10-20
- 1.3.3 — 2022-09-22
- … 13 more at https://npm.io/package/@solid-primitives/timer/versions
## README
# @solid-primitives/timer
[](https://bundlephobia.com/package/@solid-primitives/timer)
[](https://www.npmjs.com/package/@solid-primitives/timer)
[](https://github.com/solidjs-community/solid-primitives#contribution-process)
Timer primitives related to [`setInterval`](https://developer.mozilla.org/en-US/docs/Web/API/setInterval) and [`setTimeout`](https://developer.mozilla.org/en-US/docs/Web/API/setTimeout):
- [`makeTimer`](#maketimer) - Makes an automatically cleaned up timer.
- [`createTimer`](#createtimer) - [makeTimer](#maketimer), but with a fully reactive delay
- [`createTimeoutLoop`](#createtimeoutloop) - Like createInterval, except the delay only updates between executions.
- [`createPolled`](#createpolled) - Polls a function periodically. Returns an to the latest polled value.
- [`createIntervalCounter`](#createintervalcounter) - Creates a counter which increments periodically.
## Installation
```bash
npm install @solid-primitives/timer
# or
yarn add @solid-primitives/timer
```
## How to use it
### Basic Usage
#### makeTimer
Makes a timer ([setTimeout](https://developer.mozilla.org/en-US/docs/Web/API/setTimeout) or [setInterval](https://developer.mozilla.org/en-US/docs/Web/API/setInterval)), automatically cleaning up when the current reactive scope is disposed.
```ts
const callback = () => {};
const disposeTimeout = makeTimer(callback, 1000, setTimeout);
const disposeInterval = makeTimer(callback, 1000, setInterval);
// ...
dispose(); // clean up manually if needed
```
#### createTimer
[makeTimer](#maketimer), but with a fully reactive delay. The delay can also be `false`, in which case the timer is disabled. Does not return a dispose function.
```ts
const callback = () => {};
createTimer(callback, 1000, setTimeout);
createTimer(callback, 1000, setInterval);
// with reactive delay
const callback = () => {};
const [paused, setPaused] = createSignal(false);
const [delay, setDelay] = createSignal(1000);
createTimer(callback, () => !paused() && delay(), setTimeout);
createTimer(callback, () => !paused() && delay(), setInterval);
// ...
setDelay(500);
// pause
setPaused(true);
// unpause
setPaused(false);
```
#### createTimeoutLoop
Similar to an interval created with [createTimer](#createtimer), but the delay does not update until the callback is executed.
```ts
const callback = () => {};
createTimeoutLoop(callback, 1000);
// with reactive delay
const callback = () => {};
const [delay, setDelay] = createSignal(1000);
createTimeoutLoop(callback, delay);
// ...
setDelay(500);
```
#### createPolled
Periodically polls a function, returning an accessor to its last return value.
```tsx
const date = createPolled(() => new Date(), 1000);
// ...
The time is: {date()};
// with reactive delay
const [delay, setDelay] = createSignal(1000);
createPolled(() => new Date(), delay);
// ...
setDelay(500);
```
#### createIntervalCounter
A counter which increments periodically based on the delay.
```tsx
const count = createIntervalCounter(1000);
// ...
Count: {count()};
// with reactive delay
const [delay, setDelay] = createSignal(1000);
createIntervalCounter(delay);
// ...
setDelay(500);
```
### Note on Reactive Delays
When a delay is changed, the fraction of the existing delay already elapsed be carried forward to the new delay. For instance, a delay of 1000ms changed to 2000ms after 250ms will be considered 1/4 done, and next callback will be executed after 250ms + 1500ms. Afterwards, the new delay will be used.
## Demo
You may view a working example here: https://codesandbox.io/s/solid-primitives-timer-6n7dt?file=/src/index.tsx
## Changelog
See [CHANGELOG.md](./CHANGELOG.md)
---
_Source: https://npm.io/package/@solid-primitives/timer · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._