asyncEffect

Effect for async work, serialised by default. On each run the callback receives the promise from the previous run (or undefined on the first); awaiting that promise guarantees one run finishes before the next begins. For synchronous effects see effect / syncEffect.

Arguments

name	type	description
fn	(prev: Promise<any> | undefined) => any	async (or sync) function that receives the previous run's promise. Return value is awaited before the run is marked done.

Returns: void.

Examples

Sequential async

Awaiting prev serialises the work — useful for chained network requests where overlapping is wrong (stale results clobbering current ones, parallel writes racing on the server). Read id before awaiting prev so each run captures its own value.

import { asyncEffect, render, signal } from 'pota'

// stands in for a real request — resolves after a short delay
const fetchItem = id =>
	new Promise(resolve =>
		setTimeout(() => resolve({ id, name: `Item ${id}` }), 500),
	)

function App() {
	const id = signal(1)
	const data = signal(null)

	asyncEffect(async prev => {
		const current = id.read()
		await prev
		data.write(await fetchItem(current))
	})

	return (
		<div>
			<button on:click={() => id.update(n => n + 1)}>next</button>
			<pre>{() => JSON.stringify(data.read(), null, 2)}</pre>
		</div>
	)
}

render(App)