javascript 大数组或对象：浏览器性能和内存
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13309464/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
javascript big arrays or objects: browser performance and memory
提问by WHITECOLOR
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 using indexOf, slice etc. Are there some recommendations for working with big arrays in modern browsers?
我想知道使用包含大约 100 000 个元素（属性）的数组（或对象）是否会在使用 indexOf、slice 等频繁访问它们时导致浏览器中的性能或内存问题。是否有一些关于在现代浏览器中使用大数组的建议？
My particular case. I have the following structure:
我的特殊情况。我有以下结构：
tack01: [array of elements 10 000 in average] ... tack0n: [array of elements 10 000 in average]
tap01: [平均 10 000 个元素的数组] ... Tack0n: [平均 10 000 个元素的数组]
tracks average amount is 10.
曲目平均数量为 10。
element looks like {id: "xa432fds", some properties}
元素看起来像 {id: "xa432fds", some properties}
During the runtime I need to access any of the element knowing providing it's id.
在运行时，我需要访问任何知道提供它的 id 的元素。
If I use this structure without transformation I need to perform search throught all tracks and use indexOf to find element with Id.
如果我在没有转换的情况下使用这个结构，我需要在所有轨道上执行搜索并使用 indexOf 来查找具有 Id 的元素。
So I deside to create an index object which has following structure: indexObj = {id1: reference to element with id1, id2: reference to element with id2}
所以我决定创建一个具有以下结构的索引对象： indexObj = {id1: reference to element with id1, id2: reference to element with id2}
to access a certain element I just need to access indexObj[id], is it right solution for my case?
要访问某个元素，我只需要访问 indexObj[id]，这是适合我的情况的解决方案吗？
All this should be performed on the client side.
所有这些都应该在客户端执行。
回答by T.J. Crowder
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.
我想说的主要建议是真正深入了解您正在使用的内容。JavaScript中的数组根本就不是真正的数组，它们是具有 JavaScript 普通对象的所有正常管道的对象。数组索引不是数字，也不是某些内存表的偏移量*；它们是类似字典的映射中的字符串键。一旦您接受数组只是对象这一事实，它可能会开辟结构化或访问数据的新方法，这样您就可以避免诸如indexOf.
(* Barring JavaScript engine optimizations, of course.)
（* 当然，禁止 JavaScript 引擎优化。）
Update: Looking at your edit, yes, transforming the data so that you can look up tracks by using their idas 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.).
更新：查看您的编辑，是的，我建议转换数据，以便您可以使用它们id作为属性名称 ( indexObj[id])来查找曲目。然后，indexOf您将获得 JavaScript 引擎处理属性名称的好处，而不是 所需的昂贵的线性搜索，这通常是更有效的查找（b 树和/或哈希结构等）。
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).
一旦你创建了索引的版本，如果你可以释放数组版本，内存消耗由阵列及其属性名称（"0"，"1"，等），可以有资格回收，这可能是有用的（你的个人曲目会留在内存，因为您是从索引结构中引用它们）。
