Dependencies and tracking in computed observables

Question

ICSM Computer · Answer

Understanding dependencies and tracking in ko.computed observables is key to unlocking Knockout's full reactive power.
What Is a computed Observable?
A ko.computed observable is a derived value that automatically updates whenever its dependencies (observables) change.
Think of it like a spreadsheet formula — change the input cells, and the result cell updates automatically.
How Dependency Tracking Works
Knockout automatically tracks any observables you reference inside a
computed function. When those observables change, the computed value
re-evaluates itself.
Basic Example:
function ViewModel() {
  this.firstName = ko.observable("Alice");
  this.lastName = ko.observable("Smith");
  this.fullName = ko.computed(() =andgt; {
    return this.firstName() + " " + this.lastName();
  });
}
When either firstName or lastName changes, fullName auto-updates.You don’t have to tell Knockout what the dependencies are — it figures it out from your usage.
Key Rule:
and Any ko.observable or ko.computed called inside a 
ko.computed becomes a dependency.
Dependency Example
let a = ko.observable(2);
let b = ko.observable(3);
let sum = ko.computed(() =andgt; {
  console.log("Computed running");
  return a() + b();
});
console.log(sum()); // Logs: "Computed running" + 5
a(5);
console.log(sum()); // Logs: 8 (re-runs automatically)
Notice: "Computed running" only logs when one of its dependencies is accessed/changed.
Manual Re-evaluation? Not Needed!
You don't call sum() to recalculate. Just call it to get the current value — Knockout handles updates automatically.
Ignored Observables?
If you reference an observable outside the computed, it won’t be tracked.
let outside = ko.observable(10);
let result = ko.computed(() =andgt; {
  return 5; // does not use `outside()`, so no tracking
});
Advanced: pureComputed
Use ko.pureComputed() if you want a computed that’s:
Lazily evaluatedDoesn’t track dependencies until someone subscribes to it
let message = ko.pureComputed(() =andgt; {
  console.log("Pure computed evaluated");
  return a() andgt; 10 ? "High" : "Low";
});
Summary
Feature
Behavior
ko.computed()
Tracks accessed observables and re-evaluates when they change
Auto-tracking
Dependencies are inferred from code
Lazy re-evaluation
Only runs when needed
ko.pureComputed()
More performant, no initial subscriptions

interview

Dependencies and tracking in computed observables

ICSM Computer

Can you answer this question?

1 Answers

What Is a `computed` Observable?

How Dependency Tracking Works

Manual Re-evaluation? Not Needed!

Ignored Observables?

Advanced: `pureComputed`

Summary

Liked By

Feature	Behavior
`ko.computed()`	Tracks accessed observables and re-evaluates when they change
Auto-tracking	Dependencies are inferred from code
Lazy re-evaluation	Only runs when needed
`ko.pureComputed()`	More performant, no initial subscriptions