Computed

All signals are synchronous but data can be computed asynchronously.

Streams and Futures are the most common async signals, but sometimes you need to compute a value asynchronously and react to changes on input signals.

computedAsync

Async Computed is syntax sugar around FutureSignal.

Inspired by computedAsync from Angular NgExtension.

computedAsync takes a callback function to compute the value of the signal. This callback is converted into a Computed signal.

final movieId = signal('id');
late final movie = computedAsync(() => fetchMovie(movieId()));

Caution

It is important that signals are called before any async gaps with await.

Any signal that is read inside the callback will be tracked as a dependency and the computed signal will be re-evaluated when any of the dependencies change.

computedFrom

Async Computed is syntax sugar around FutureSignal.

Inspired by computedFrom from Angular NgExtension.

computedFrom takes a list of signals and a callback function to compute the value of the signal every time one of the signals changes.

final movieId = signal('id');
late final movie = computedFrom([movieId], (args) => fetchMovie(args.first));

Since all dependencies are passed in as arguments there is no need to worry about calling the signals before any async gaps with await.