为什么这两个相同的基准测试在同一个浏览器但两个不同的平台上有不同的结果?

Why do these two identical benchmarks have different results on the same browser but with two different platforms?

我想了解为什么这两个相同的基准测试在这两个不同的平台上有不同的结果。

  1. Classcat, clsx, obj-str, vanilla JS on perf.link

  2. Classcat, clsx, obj-str, vanilla JS on measurethat

第一个arr.filter(Boolean).join(" ")最快,第二个最慢!

为什么?

我使用的代码是这样的:

import classcat from "https://unpkg.com/classcat?module"
import clsx from "https://unpkg.com/clsx?module"
import objstr from "https://unpkg.com/obj-str?module"

const obj = {
  one: true,
  abcd: Math.random() <= 0.5,
  efghijkl: Math.random() <= 0.5,
  mnopqrstuvwxyz: Math.random() <= 0.5,
  efghijklmnopqrstuvwxyz: Math.random() <= 0.5,
  abcdefghijklmnopqrstuvwxyz: Math.random() <= 0.5,
  abcd: Math.random() <= 0.5,
  efghijkl: Math.random() <= 0.5,
  mnopqrstuvwxyz: Math.random() <= 0.5,
  efghijklmnopqrstuvwxyz: Math.random() <= 0.5,
  abcdefghijklmnopqrstuvwxyz: Math.random() <= 0.5,
  two: false,
  three: true
}

const arr = [
  true && "one",
  Math.random() <= 0.5 && "abcd",
  Math.random() <= 0.5 && "efghijkl",
  Math.random() <= 0.5 && "mnopqrstuvwxyz",
  Math.random() <= 0.5 && "efghijklmnopqrstuvwxyz",
  Math.random() <= 0.5 && "abcdefghijklmnopqrstuvwxyz",
  Math.random() <= 0.5 && "abcd",
  Math.random() <= 0.5 && "efghijkl",
  Math.random() <= 0.5 && "mnopqrstuvwxyz",
  Math.random() <= 0.5 && "efghijklmnopqrstuvwxyz",
  Math.random() <= 0.5 && "abcdefghijklmnopqrstuvwxyz",
  false && "two",
  true && "three",
]
classcat(arr)
classcat(obj)
clsx(arr)
clsx(obj)
objstr(obj)
arr.filter(Boolean).join(" ")

这是您不能信任 js 基准测试的主要示例。 测试的方式 运行,样板代码,一切都会产生影响。引擎针对每种情况进行了优化,最终结果是垃圾。

读这个:https://medium.com/cacher-app/how-js-benchmarks-lie-fa35fa989ee0
或讨论:

当我的代码出现问题时,我会在确切的上下文中对其进行测试,因为这是它实际需要快速执行的地方。这意味着1个解决方案不适合所有,很多,但不是全部。