ko.utils.compareArrays

http://www.knockmeout.net/2011/04/utility-functions-in-knockoutjs.html

HTML

<script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>
<script src="https://cdn.bootcss.com/knockout/2.2.0/knockout-min.js"></script>
<div id="list" data-bind="template: {name: 'tmpl', foreach: computedData, afterRender: called}"></div>

<script id="tmpl" type="text/html">
    <div>${ $data.name}</div>
</script>
<button id="mod">add one</button>
<button id="remake">clear</button>
<div class="grey"></div>

CSS

.grey {background: #efefef; padding: 5px; border: 1px solid #000;}

JavaScript

var data = [{name: "one"}, {name: "two"}, {name: "three"}];


var viewModel = {
    items: ko.observableArray(data),
    called: function() {$('.grey').append('called<br/>');}
};

viewModel.computedData = ko.computed(function() {
    return viewModel.items();
}, viewModel);
    
ko.applyBindings(viewModel);
                        
$(document).ready(function(){
    $('#mod').click(function() {
        viewModel.items.push({name: "new one"});
    });
    $('#remake').click(function() {
        viewModel.items.removeAll();
    });
});