derived() — svelte Function Reference

Architecture documentation for the derived() function in deriveds.js from the svelte codebase.

Function javascript ClientRuntime Reactivity calls 1 called by 3

Entity Profile

ClientRuntime→ Reactivity→ derived() — svelte Function Reference

Dependency Diagram

graph TD
  9b434868_abac_094f_b009_bb7564b0d40d["derived()"]
  2fb8b3eb_7c25_3930_a184_09fab29d537f["deriveds.js"]
  9b434868_abac_094f_b009_bb7564b0d40d -->|defined in| 2fb8b3eb_7c25_3930_a184_09fab29d537f
  2bef4c90_800a_61a0_724e_32f34a823482["init()"]
  2bef4c90_800a_61a0_724e_32f34a823482 -->|calls| 9b434868_abac_094f_b009_bb7564b0d40d
  107a9b3c_9fe4_0721_cb75_6306bf9e5aed["user_derived()"]
  107a9b3c_9fe4_0721_cb75_6306bf9e5aed -->|calls| 9b434868_abac_094f_b009_bb7564b0d40d
  bce9da9e_fd64_163a_8582_ad1a0c6518ce["derived_safe_equal()"]
  bce9da9e_fd64_163a_8582_ad1a0c6518ce -->|calls| 9b434868_abac_094f_b009_bb7564b0d40d
  cc46feba_170d_5970_a6be_f512f15aa0ee["get_error()"]
  9b434868_abac_094f_b009_bb7564b0d40d -->|calls| cc46feba_170d_5970_a6be_f512f15aa0ee
  style 9b434868_abac_094f_b009_bb7564b0d40d fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/svelte/src/internal/client/reactivity/deriveds.js lines 55–89

export function derived(fn) {
	var flags = DERIVED | DIRTY;
	var parent_derived =
		active_reaction !== null && (active_reaction.f & DERIVED) !== 0
			? /** @type {Derived} */ (active_reaction)
			: null;

	if (active_effect !== null) {
		// Since deriveds are evaluated lazily, any effects created inside them are
		// created too late to ensure that the parent effect is added to the tree
		active_effect.f |= EFFECT_PRESERVED;
	}

	/** @type {Derived<V>} */
	const signal = {
		ctx: component_context,
		deps: null,
		effects: null,
		equals,
		f: flags,
		fn,
		reactions: null,
		rv: 0,
		v: /** @type {V} */ (UNINITIALIZED),
		wv: 0,
		parent: parent_derived ?? active_effect,
		ac: null
	};

	if (DEV && tracing_mode_flag) {
		signal.created = get_error('created at');
	}

	return signal;
}