Javascript Immutable.JS Seq/lazy map性能最佳实践？

我喜欢在Preact中使用immutable.js。它们可以很好地协同工作，因为React/Preact的状态与容器的交互很差，除非容器是不可变的

我发现自己遇到了一种情况（；参见branch libp2p preact，source src/index.tsx；它是带有JSX的TypeScript）我有一个不可变的容器，里面装满了字符串，我需要将它们呈现为JSX。我通常的做法是创建一个JSX.Elements数组，并将它们内联到一个JSX节中。因此，在示例中，我有一个

OrderedSet用户列表

：

const users = userList.toArray().map(
  s => <div className="Id">{s}</div>
)
return <div className="ListBox">
  <div className="List">{users}</div>
</div>

让

不可变.OrderedSet

进行映射

const users = userList.toArray().map(s => <div>{s}</div>) 

const users = userList.map(s => <div>{s}</div>).toArray()

const users = userList.toSeq().map(s => <div>{s}</div>).toArray()

我认为2是最糟糕的选择，因为我认为它实际上创建了一个完整的第二临时OrderedSet，它肯定比数组更重，而且我认为不会发生任何懒惰行为

然而，原则上，3可能更好，因为Seq做的每件事都是“懒惰”的。所以我的问题是：（3）真的比（1）好吗？如果是，为什么

如果你问：“如何更好？”，我关心的是创建的垃圾数量，以及扫描列表的次数。我在C#的时间让我不合理地避免创建不必要的大型垃圾数组

我的假设是（3）比（1）好，特别是如果userList很大，因为（1）将创建一个包含N个字符串元素的数组，然后通过运行map函数创建第二个包含N个div元素的数组；而（3）将等待构建任何内容，直到调用toArray，然后它将在userList上迭代，直接构建一个div数组。这两种方法都将创建垃圾，但在（3）的情况下，垃圾将是一个或两个小的seq（）对象，而在（1）的情况下，垃圾可能是一个完整的N长度数组。但我不知道immutable.js或Javascript虚拟机在实践中是否以这种方式工作

---

（注意，Preact对于这个问题可能并不重要；重要的是我有一个不可变的标识符集合，我想将它转换为一个数组，每个元素上都有一个简单的映射fn。）

事实是，你可以做得比你提到的三个选项都好。由于

OrderedSet

是一个iterable，并且您的目标是从中创建一个普通数组，因此可以使用ES6标准

数组。from

函数及其第二个回调参数（映射器）：

constusers=Array.from（userList，s=>{s}）

事实是，你可以做得比你提到的三个选项都好。由于

OrderedSet

是一个iterable，并且您的目标是从中创建一个普通数组，因此可以使用ES6标准

数组。from

函数及其第二个回调参数（映射器）：

constusers=Array.from（userList，s=>{s}）

让我惊讶的是，

.valueSeq（）.map（（v）=>（{v}））.toArray（）比数组快。
从方法（在chrome中测试）到我惊讶的是，
.valueSeq（）.map（（v）=>（{v}））.toArray（）比数组快。从方法（在chrome中测试）
const users = Array.from(userList, s => <div>{s}</div>)