Question

I am developing a web application and have decided to go with knockout.js to manage client side UI and bindings. Really liking it so far, but have a few questions regarding ko.observables. My intial payload of data looks like:

{
    clients: [{id:1, fname:'foo', lname:'bar', email:'...', ...}, ...]},
    appointments: [{...appointment object...}, ...]
}

any object in the data above could hold A LOT of data, easily several hundred objects like the ones above, with each object containing 10 – 15 properties. Currently, on my applications init, I’m doing something like:

$.each(clients, function (idx, client) {
    $.each(client, function (property, value) {
        client[property] = ko.observable(value);
    });

    client[idx] = client;
});

self.clients = ko.observableArray(clients);

This seems to work, but also seems like a lot of overhead, and I notice a sizable lag while my app is in it’s init step (no ajax required, the data is loaded into the page when it’s rendered). Are there any patterns for working with large data sets like this? Because any of above data objects can be edited, I figure they should be observable. Thanks for any pointers!

Answer 1

I am currently looking at this same problem when I stumbled onto your post. I then found this post and the blog post and jsfiddle example. This seems to be what you(and I) are looking for.