JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" data-bind="value: firstName" />
<input type="text" data-bind="value: lastName" />
<p data-bind="html: fullName"></p>
<hr>
<pre data-bind="text: console"></pre>

JavaScript

ko.extenders.changeTracker = function(target, trackingPropertyName) {
	target.subscribe(function(value) {
  	target[trackingPropertyName] = true;
  });
	return target;
}

class ViewModel {
	constructor() {
  	let trackingPropertyName = '__mytracker';
  	this.firstName = ko.observable().extend({ changeTracker: trackingPropertyName });
    this.lastName = ko.observable().extend({ changeTracker: trackingPropertyName });
    this.fullName = ko.pureComputed(function() {
    	let f = this.firstName() || '';
      let l = this.lastName() || '';
      if (this.firstName[trackingPropertyName]) {
      	this.console(this.console() + 'firstName changed\r\n');
        this.firstName[trackingPropertyName] = false;
      }
      if (this.lastName[trackingPropertyName]) {
      	this.console(this.console() + 'lastName changed\r\n');
        this.lastName[trackingPropertyName] = false;
      }
      return `${f} ${l}`;
    }, this);
    this.console = ko.observable('');
  }
}

let vm = new ViewModel();

ko.applyBindings(vm);