React 长键值对组件的性能影响

【问题标题】：React performance implications of long key value on componentReact 长键值对组件的性能影响
【发布时间】：2017-05-13 20:29:45
【问题描述】：

如何将字符串的长度应用于从某些数据集创建的某些组件集合，如下所示：

{this.state.list.map(item => {
  const url = item.url;
  return (
    <ListItemComponent url={url} key={url}/>
  );
})}

有什么限制吗？长键值对性能有何影响？

背景。有时我们需要创建很长的项目列表（比如编码了很多参数的 url），只有适合/唯一的东西用作自然键是这个很长的东西。

【问题讨论】：

标签： javascript performance reactjs jsx

【解决方案1】：

用于密钥的字符串长度根本不应该影响性能。

Javascript 中的字符串是不可变的，另外现代 Javascript 引擎使用 string interning，这意味着当您的解释器检查是否 '/some/url/ === '/some/other/url' 时，它不需要遍历数组中的每个字符 O(n ) 线性时间，但可以简单检查两个值是否相同。

有关更多上下文，请参阅此答案：Do common JavaScript implementations use string interning?

【讨论】：