Skip to main content

Throttled

A wrapper over `useThrottle` that returns a throttled state.

Demo

Search for something above!

Usage

This is a simple wrapper over useThrottle that returns a throttled state.

		<script lang="ts">
	import { Throttled } from "runed";
 
	let search = $state("");
	const throttled = new Throttled(() => search, 500);
</script>
 
<div>
	<input bind:value={search} />
	<p>You searched for: <b>{throttled.current}</b></p>
</div>

You may cancel the pending update, or set a new value immediately. Setting immediately also cancels any pending updates.

		let count = $state(0);
const throttled = new Throttled(() => count, 500);
count = 1;
throttled.cancel();
// after a while...
console.log(throttled.current); // Still 0!
 
count = 2;
console.log(throttled.current); // Still 0!
throttled.setImmediately(count);
console.log(throttled.current); // 2