js 在线性能测试 函数调用和三元运算符 闭包和局部变量

 

原文链接: js 在线性能测试 函数调用和三元运算符 闭包和局部变量

上一篇: rubik-cube-solver 使用js求解魔方

下一篇: pnpm 使用workspace实现monorepo

https://jsben.ch/

 

测试三元运算符和函数, 最快的是Math, 感觉是有啥特殊优化吗, 还是说判断条件太多了导致的性能问题, 差距有点大啊

const clamp = (x, lo, hi) => {
  return x < lo ? lo : x > hi ? hi : x;
};
console.log(clamp(-3, 0, 2));

const list = [];
const size = 100000;
for (let i = 0; i < size; i++) {
  list.push([Math.random(), Math.random(), Math.random()]);
}

// 最快
const clamp = (x, lo, hi) => {
  return Math.min(Math.max(x, lo), hi);
};

for (let i = 0; i < list.length; i++) {
  const item = list[i];
  clamp(item[0], item[1], item[2]);
}

const clamp = (x, lo, hi) => {
  return x < lo ? lo : x > hi ? hi : x;
};

for (let i = 0; i < list.length; i++) {
  const item = list[i];
  clamp(item[0], item[1], item[2]);
}
const clamp = (x, lo, hi) => {
  if(x<lo) return lo
  if(x>hi) return hi
  return x
};

for (let i = 0; i < list.length; i++) {
  const item = list[i];
  clamp(item[0], item[1], item[2]);
}

 

 

闭包和局部变量

 

局部变量最快, 说明跨作用域的开销不小, 所以说不需要担心内存优化问题, v8已经帮你搞定了

 

// 局部变量性能测试
// https://zhuanlan.zhihu.com/p/53188609

import Benchmark from "benchmark";
const suite = new Benchmark.Suite();
const size = 500000;
// 不适用中间变量有一点点优势
// https://jsben.ch/
// 跨函数作用域性能会有10%的开销..., 除了高性能计算场景, 一般可以忽略
const list = Array(size * 3)
  .fill(0)
  .map(() => Math.random());

function f1() {
  const res = Array(size * 3);
  for (let i = 0; i < size; i += 3) {
    const a = list[i + 0];
    const b = list[i + 1];
    const c = list[i + 2];
    res[i] = res[i + 1] = res[i + 2] = (a + b + c) / 3;
  }
}
function f2() {
  const res = Array(size * 3);
  let a, b, c;
  for (let i = 0; i < size; i += 3) {
    a = list[i + 0];
    b = list[i + 1];
    c = list[i + 2];
    res[i] = res[i + 1] = res[i + 2] = (a + b + c) / 3;
  }
}
function f3() {
  const res = Array(size * 3);
  for (let i = 0; i < size; i += 3) {
    res[i] = res[i + 1] = res[i + 2] =
      (list[i + 0] + list[i + 1] + list[i + 2]) / 3;
  }
}
let a, b, c;
function f4() {
  const res = Array(size * 3);
  for (let i = 0; i < size; i += 3) {
    a = list[i + 0];
    b = list[i + 1];
    c = list[i + 2];
    res[i] = res[i + 1] = res[i + 2] = (a + b + c) / 3;
  }
}
// add tests
suite
  .add("String#局部变量", function () {
    f1();
  })
  .add("Array#全局变量", function () {
    f2();
  })
  .add("Array#不使用中间变量", function () {
    f3();
  }).add("Array#闭包", function () {
    f3();
  })
  // add listeners
  .on("cycle", function (event) {
    // console.log('event', event)
    console.log(String(event.target));
  })
  .on("complete", function () {
    // console.log('this', this)
    console.log("Fastest is ", this.filter("fastest").map("name"));
    console.log("name is ", this.map("name"));
    console.log(
      "mean is ",
      this.map("stats").map((x) => x.mean)
    );
    // console.log('times is ', this.map('times'));
  })
  // run async
  .run({ async: true });

// 好像差不太多的样子...
/*
String#局部变量 x 55.81 ops/sec ±2.71% (61 runs sampled)
Array#全局变量 x 56.20 ops/sec ±2.06% (57 runs sampled)
Array#不使用中间变量 x 56.77 ops/sec ±2.31% (58 runs sampled)
Fastest is  [ 'Array#不使用中间变量', 'Array#全局变量', 'String#局部变量' ]
name is  [ 'String#局部变量', 'Array#全局变量', 'Array#不使用中间变量' ]
mean is  [ 0.01791701055054645, 0.01779476451315789, 0.01761430540373563 ]

 */