← Back to patterns

Derived reactive query

Using $derived() to create reactive queries

Pattern Usage:

let delay = $state(1000);

// Query automatically re-runs when delay changes
let timeQuery = $derived(getDelayedTime({ delay }));

Live Demo:

How it works: Using $derived() creates a reactive query that automatically re-runs whenever its dependencies change. Change the delay slider above and watch the query re-execute with the new parameter.