on

Effect with explicit dependencies. on(depend, fn) runs depend in a tracking scope and fn outside of one — so only depend's reads become deps and reads inside fn stay snapshot-style. Handy when the handler reads other signals you don't want as dependencies. The auto-tracking form is effect; for one-off untracked reads inside an existing effect, see untrack.

Arguments

name	type	description
depend	() => unknown	tracked function whose reads become the effect's dependencies
fn	() => void	untracked body — runs once on creation, then after every change to depend

Returns: void.

Examples

Explicit dependencies

Only trigger drives the effect; noisy is read as a snapshot. Click re-run to bump trigger and the effect fires; click mutate noisy as many times as you like and it won't re-run until trigger changes again.

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

function App() {
	const trigger = signal(0)
	const noisy = signal('initial')
	const log = signal('')

	on(
		() => trigger.read(),
		() => {
			// reads `noisy` only as a snapshot — we don't want to
			// re-run when `noisy` changes
			log.write(`run #${trigger.read()} saw ${noisy.read()}`)
		},
	)

	return (
		<div>
			<p>{log.read}</p>
			<button on:click={() => trigger.update(n => n + 1)}>
				re-run
			</button>
			<button
				on:click={() =>
					noisy.write(`changed ${Math.random().toFixed(2)}`)
				}
			>
				mutate noisy (no re-run)
			</button>
		</div>
	)
}

render(App)