In Javascript: memory allocation versus large object manipulation

Question

I have a JavaScript module that maintains and manipulates a lot of data. I have four large structures -- each basically an object of objects of objects of arrays. And there's a lot of data in them. When a user does something like delete or update something, I need to go through each of these structures and reliably modify the structure to reflect the change. In some structures, depending on the user action, I don't know which "leaf" object i need to change, so i have to iterate through all, etc.

An alternative to manipulating these large structures when a change takes place is to null them out and rebuild them from their raw data. And that's my question:

From a performance point of view, in Javascript, would it be more optimal to loop through and modify existing (large) data structures or simply rebuild the structures from their raw data?

I'm sure the answer might be "it depends" but a) assume large amount of data; b) assume frequent changes to that data.

Answer 1

Sorry, I know you're not expecting this answer, but "it depends" :-) However, I think the best answer I can give you is what I did when I faced exactly the same problem: I implemented myself a simple testbench to measure the time taken for doing certain operations on the huge superobject: I got mean time measures for different levels of information entropy and it turned that the fastest solution was rebuilding the structure from raw. I specially noticed this in Internet Explorer. Perhaps IE does not perform well in loops (I'm speculating) and traversing the superobject was quite slower than rebuilding it. So, it may not only depend on the structure of the superobject but also on the javascript engine.

But, again, it is my case. I recommend to implement yourself a simple testbench: it doesn't take too much time but makes you get good results at the end ;-)

EDIT :

Just as an addendum, I wonder whether building the superobject on the server's side and then sending it back to the browser as a JSON object would improve results or not. I don't know if it could be possible in your case. You could implement some sort of AJAX-accessible PHP script that receives commands (such as insert, delete, rename, whatever..) and then it'd send back the new JSON object to the browser, which would only parse the object (probably a fast operation??)

Answer 2

I'm not sure it's applicable here, but it reminds me of a blog post from wingolog.org about v8's implementation:

Ed.: Vyacheslav Egorov writes in to say that what V8 keeps around is actually the function source, not the AST. It re-parses as needed. Makes sense. I recall Lars Bak saying in a video that source is the most compact IR there is, and indeed maybe that is the case.

So basically, when v8 compiles JavaScript, it only keeps the raw data (source code) because in this case, the memory footprint is what affects performance most.