Question

I’m rewriting a JavaScript library that I wrote some time ago.
Its purpose is to display an array of objects as a table, that can be sorted, filtered and edited without server communication.

The current solution “pollutes” the objects with additional attributes, that are needed to steer the display.
The original object may look like this

{"name":"...","lastname":"...","age":27}

And then it has additional attributes like this

{"name":"...","lastname":"...","age":27,"TTMDecode":true,"TTMChildren":[]}

An alternative Solution may be to only wrap the original object and then work with these wrappers.

{"decode":true,"children":[],"data":{"name":"...","lastname":"...","age":27}}

I’m not sure which solution is preferable.
With the second solution it’s easier to return the original object to the server, in the case it was changed, but it doubles the amount of objects for the JavaScript engine.

The solution is able to work with over 20.000 objects and it’s fast in current browsers.
But will 40.000 Objects be a problem?

I hope I explained my worries good enough.

Regards

Answer 1

First, about your architecture problem: why not make a parent object with the two properties display and data ? You should not limit your architecture because of performance worries, if it has effect, you will notice it when measuring the performance.

var obj = {
    display: {
      // display data
    },
    data: {
      // personal data
    }
);

Which implicitly answers the question about the object count, this normally does not matter (if the objects themselves are not huge, it won’t affect your performance)