Javascript Big Arrays Or Objects: Browser Performance And Memory

I wonder if working with arrays (or objects) which contain about 100 000 elements (properties) can cause performance or memory problems in browsers when frequently access them usin

Solution 1:

It's a very broad question.

I'd say the primary recommendation would be to really deeply understand what you're working with. Arrays in JavaScript aren't really arrays at all, they're objects with all the normal plumbing of JavaScript normal objects. Array indexes aren't numbers, aren't offsets into some memory table*; they're string keys in a dictionary-like map. Once you embrace the fact that arrays are just objects, it may open up new ways of structuring or accessing your data such that you can avoid expensive operations like indexOf.

(* Barring JavaScript engine optimizations, of course. And engines do optimize.)

---

Update: Looking at your edit, yes, transforming the data so that you can look up tracks by using their id as a property name (indexObj[id]) is what I'd recommend. Then, instead of the expensive linear search required by indexOf, you get the benefit of the JavaScript engine's handling of property names, which will typically be a much more efficient lookup (b-trees and/or hash structures, etc.).

Once you've created your indexed version, if you can release the array version, the memory consumed by the array and its property names ("0", "1", etc.) can be eligible for reclamation, which may be useful (your individual tracks will remain in memory because you're referencing them from the indexed structure).