首页 > 解决方案 > 为什么浏览器数组操作之间存在如此大的性能差异?

问题描述

我正在调整我的库goodcore并设置了一些性能测试来与本机数组函数进行比较。然后我在笔记本电脑上针对 Edge、FF、Chrome 和 Node 10.9 运行它们。当然,我的 lib 的结果好坏参半,但更有趣的是,浏览器之间的差异有时是最佳和最差之间的 30 倍,而且在操作之间似乎并没有完全不同。

使用的数组长度为 10000,随机整数介于 0 到 100000 之间。

编辑版本:

这是我的结果(仅适用于本机操作):

编辑:现在具有正确的值和自定义算法(非本机)

图1 图2

数据显示 Benchmark.js 中的 ops/sec。

在此处输入图像描述

这是由于数据结构实现还是微优化?

标签: node.jsperformancefirefoxmicrosoft-edgev8

解决方案


这是由于数据结构实现还是微优化?

是的。

更长的答案:可能两者兼而有之,但确定回答这个问题的唯一方法是详细查看每个浏览器的实现。

您特别测量的较大差异看起来可能是由于引擎盖下的数据结构选择根本不同;然而,即使使用相同的基本数据结构,其余实现的效率也会产生巨大的差异(我见过 10x - 100x)。

此外,恕我直言,您的结果有些可疑:Chrome 和 Node 使用相同的 V8 引擎,并且性能应该非常相似。像“indexOf”或“splice(remove 1)”这样的结果,你看到的结果应该是 ~ 相同的结果之间有 ~ 10 倍的差异,这表明你的基准测试中可能有问题。如果这两个结果不可信,那么你为什么会对 Edge/Firefox 的结果更有信心呢?

说到基准质量:仅使用一种类型的数组(仅一种大小,仅一种类型的内容,始终密集)是您的结果可能无法反映完整情况的另一个原因;所以请小心从中得出任何结论。

为什么会有这么大的性能差异

因为使Array内置方法快速运行需要大量的工程工作。每个浏览器的工程团队都在尽最大努力将时间花在他们认为最重要的功能上。结果是您会在各种实现中看到不同程度的优化。

如果在底层选择的数据结构存在差异(我不知道),那么这些通常是权衡:一个选择可能在 X 处更快,但在 Y 处比另一种选择慢;或者一个可能更快但消耗更多内存;等等


推荐阅读