Knockout computed observables interoperability with regional time zone handling

Short answer

No — a Knockout computed does not re-evaluate when a Date's internal getTime() value changes after an offset adjustment, because Knockout tracks reads of observables, not mutations of plain objects. A Date is not observable. The fix is not to make the Date reactive, but to restructure: keep the canonical instant in the observable and do time zone conversion inside the computed.

What Knockout actually tracks

During evaluation, a computed records every observable it reads. It re-runs only when one of those observables notifies subscribers. Two consequences follow:

• Mutating a Date in place (e.g., date.setMinutes(...) or manual offset math) is invisible to Knockout. The computed will stay stale.
• Replacing the observable's value with a new Date instance (obs(newDate)) triggers notification, because Knockout compares objects by reference. Calling obs.valueHasMutated() after an in-place change also forces notification, but this is a workaround, not a pattern.

Recommended pattern

Store the instant as UTC epoch milliseconds (or an ISO 8601 string) in the source observable, and convert for display inside the computed:

// Source of truth: a plain instant, no locale baked in
self.timestampUtc = ko.observable(Date.now());

self.displayTime = ko.computed(function () {
    return new Intl.DateTimeFormat('de-DE', {
        timeZone: 'Europe/Berlin',
        dateStyle: 'short',
        timeStyle: 'medium'
    }).format(new Date(self.timestampUtc()));
});

Conversion is now a pure function of a tracked dependency. When timestampUtc changes, the computed re-evaluates and the UI updates — across any locale, with no manual subscriptions. Prefer IANA time zone names with Intl.DateTimeFormat over manual getTimezoneOffset() arithmetic, which breaks around DST transitions.

If you must wrap a timezone-aware Date

Set the observable with a freshly constructed Date rather than mutating the existing one:

var adjusted = new Date(source().getTime() + offsetMs);
dateObservable(adjusted); // new reference => notification fires

Never store a locale-formatted string as the source of truth; parsing it back is ambiguous across DST boundaries.

Extenders and circular-dependency risk

Extenders can safely intercept normalized values using the standard writable-computed pattern: the extender returns a computed whose read formats the underlying observable and whose write parses input back into it. The one hard rule is that the computed must never read its own output. A write path that conditionally reads the wrapped computed before writing the underlying observable can recurse indefinitely. Keep the extender's read and write strictly routed through the target observable, and the reactive graph stays acyclic.

Performance notes

Pure, cheap conversions inside a computed add negligible overhead. The real cost appears when a computed depends on a high-frequency source such as a ticking clock observable: it re-evaluates on every tick. Throttle or rate-limit the source observable (e.g., update it once per second instead of per animation frame) rather than trying to debounce the computed.

How to verify

1. In a console, mutate a Date held in an observable in place and confirm a dependent computed does not re-run; then assign a new Date instance and confirm it does.
2. Change the instant observable feeding an Intl.DateTimeFormat computed and confirm the UI updates with no manual subscription.
3. Unit-test a conversion across a DST boundary for your target locale.
4. Profile a ticking-clock view in browser dev tools and confirm throttling the source reduces computed evaluations.

Assumes Knockout 3.x behavior; these semantics have been stable across the 3.x line, but confirm against your installed version if you are on an older release.