a reactive (signals based) hypermedia web framework (wip)
stormlightlabs.github.io/volt/
desertthunder.dev
hypermedia
frontend
signals
1---
2version: 1.0
3updated: 2025-10-18
4---
5
6# asyncEffect
7
8Async effect system with abort, race protection, debounce, throttle, and error handling
9
10## asyncEffect
11
12Creates an async side effect that runs when dependencies change.
13Supports abort signals, race protection, debouncing, throttling, and error handling.
14
15```typescript
16export function asyncEffect( effectFunction: AsyncEffectFunction, dependencies: Array<Signal<unknown> | ComputedSignal<unknown>>, options: AsyncEffectOptions = {}, ): () => void
17```
18
19**Example:**
20
21```typescript
22// Fetch with abort on cleanup
23const query = signal('');
24const cleanup = asyncEffect(async (signal) => {
25 const response = await fetch(`/api/search?q=${query.get()}`, { signal });
26 const data = await response.json();
27 results.set(data);
28}, [query], { abortable: true });
29
30// Debounced search
31asyncEffect(async () => {
32 const response = await fetch(`/api/search?q=${searchQuery.get()}`);
33 results.set(await response.json());
34}, [searchQuery], { debounce: 300 });
35
36// Error handling with retries
37asyncEffect(async () => {
38 const response = await fetch('/api/data');
39 if (!response.ok) throw new Error('Failed to fetch');
40 data.set(await response.json());
41}, [refreshTrigger], {
42 retries: 3,
43 retryDelay: 1000,
44 onError: (error, retry) => {
45 console.error('Fetch failed:', error);
46 // Optionally call retry() to retry immediately
47 }
48});
49```