Services
Technology Web App Development Mobile App Development Windows App Development Database Development UI/UX Development Cloud Development SEO Digital Marketing Guest Posting Content Writing Artificial Intelligence Data Science ERP Development CRM Development CMS Development LMS Development Business Listing Blockchain Technology Startup Promotion AI Tools Integration
Products
Data Converter Cleaner TUC - Unit Converter Import Export Survey Manager Tweet Controller
Developer
Article Blog Forum Interview Beginner News Startup Quiz
Users
Career
Apply Job Internship
Pricing
Login Sign Up Get a Quote

interview

Home Interviews Dependencies and tracking in computed observables – MindStick
Ask Question

1 Answers

ICSM Computer
ICSM Computer 23 Apr 2025
Report Abuse

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(() => {
    return this.firstName() + " " + this.lastName();
  });
}
  1. When either firstName or lastName changes, fullName auto-updates.
  2. You don’t have to tell Knockout what the dependencies are — it figures it out from your usage.

Key Rule:

 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(() => {
  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(() => {
  return 5; // does not use `outside()`, so no tracking
});

Advanced: pureComputed

Use ko.pureComputed() if you want a computed that’s:

  1. Lazily evaluated
  2. Doesn’t track dependencies until someone subscribes to it
let message = ko.pureComputed(() => {
  console.log("Pure computed evaluated");
  return a() > 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
MindStick Training
Markdown for AI

A clean, structured version of this page for AI assistants and LLMs.

Open .md