xgqfrms™, xgqfrms® : xgqfrms's offical website of cnblogs! xgqfrms™, xgqfrms® : xgqfrms's offical website of GitHub!

how to measure function performance in javascript All In One

how to measure function performance in javascript All In One

Performance API

  1. Performance Timeline API
  2. Navigation Timing API
  3. User Timing API
  4. Resource Timing API.

https://developer.mozilla.org/en-US/docs/Web/API/Performance

performance.measure

performance.measure(name);
performance.measure(name, startMark);
performance.measure(name, startMark, endMark);
performance.measure(name, undefined, endMark);

performance.mark

performance.mark(name);

performance.now

js 高精度时间戳

const t1 = performance.now();

// do somethings

const t2 = performance.now();


// const arr = (new Uint8Array(100000)).map((item, i) => i +  1);
const arr = (new Uint32Array(100000)).map((item, i) => i +  1);

// arr.length;
// 100000
// arr;

function testPerformance(arr, i) {
  let startTime = performance.now();
  console.log(`arr[i], i =`, arr[i], i);
  let endTime = performance.now();
  console.log(`🚀performance time is \`${endTime - startTime}\` ms`);
}

function testTime(arr, i) {
  console.time('array test');
  console.log(`arr[i], i =`, arr[i], i);
  console.timeEnd('array test');
  // console.log(`🚀performance time is \`${endTime - startTime}\` ms`);
}


setTimeout(() => {
  testPerformance(arr, 0);
  testPerformance(arr, 99999);

  console.log('\n');

  testTime(arr, 0);
  testTime(arr, 99999);
}, 0);


// testPerformance(arr, 0);
// testPerformance(arr, 99999);

// console.log('\n');

// testTime(arr, 0);
// testTime(arr, 99999);

/*

https://developer.mozilla.org/en-US/docs/Web/API/Performance/now


https://developer.mozilla.org/en-US/docs/Web/API/console/time

https://developer.mozilla.org/en-US/docs/Web/API/console/timeEnd


https://nodejs.org/api/perf_hooks.html#perf_hooks_class_performance

https://nodejs.org/api/console.html#console_console_timeend_label




*/

High Resolution Time Level 2

W3C Recommendation 21 November 2019

https://www.w3.org/TR/hr-time/


const log = console.log;

const noForArrayAutoGenerator = (len = 100) => {
  return [...``.padStart(len, ` `)].map((item, i) => i + 1).map((item, i) => i % 2 === 0 ? item : item + ``);
}

const arr = noForArrayAutoGenerator(1000 * 100);

function test(arr = []) {
  const begin = performance.now();
  for (let i = 0; i < arr.length; i++) {
    // log(`item${i}`, arr[i]);
  }
  const end = performance.now();
  const result = end - begin;
  log(`result`, result)
}

test();

console.time & console.timeEnd

无返回值⚠️


const log = console.log;

console.time(`label`);

setTimeout(() => log(`zero`), 1000);
// 62

console.timeEnd(`label`);
// label: 16111.451171875 ms

https://developer.mozilla.org/en-US/docs/Web/API/Console/timeEnd

https://developer.mozilla.org/en-US/docs/Web/API/Console/time

console.log & new Date().getTime()


// new Date().getTime()

test

"use strict";

/**
 *
 * @author xgqfrms
 * @license MIT
 * @copyright xgqfrms
 * @created 2020-07-20
 * @modified
 *
 * @description performance
 * @difficulty Easy Medium Hard
 * @complexity O(n)
 * @augments
 * @example
 * @link
 * @solutions
 *
 */

const log = console.log;

const noForArrayAutoGenerator = (len = 100) => {
  return [...``.padStart(len, ` `)].map((item, i) => i + 1).map((item, i) => i % 2 === 0 ? item : item + ``);
}

// const arr = noForArrayAutoGenerator(1);
// const arr = noForArrayAutoGenerator(100);
const arr = noForArrayAutoGenerator(10000);
// const arr = noForArrayAutoGenerator(10000 * 10);
// const arr = noForArrayAutoGenerator(10000 * 1000);

function test(arr = []) {
  // ReferenceError: performance is not defined
  const begin = performance.now();
  for (let i = 0; i < arr.length; i++) {
    // log(`item${i}`, arr[i]);
  }
  const end = performance.now();
  const result = end - begin;
  log(`result`, result)
}

test();

demos

~~ double not bitwise

  1. Chrome 109.x.x
"use strict";

/**
 *
 * @author xgqfrms
 * @license MIT
 * @copyright xgqfrms
 * @created 2022-07-22
 * @modified 2022-09-27
 * @modified 2023-02-25
 *
 * @description js performance.now / console.time & console.timeEnd
 * @description js 高精度时间戳 / 性能优化 / 性能测试
 * @difficulty Easy
 * @time_complexity O(n)
 * @space_complexity O(n)
 * @augments
 * @example
 * @link https://www.cnblogs.com/xgqfrms/p/16736458.html
 * @link https://www.cnblogs.com/xgqfrms/p/13360113.html
 * @solutions
 *
 * @best_solutions
 *
 */

// export {};

// const log = console.log;

function math(n) {
  const nums = [];
  let startTime = performance.now();
  for (let i = 0; i < n; i++) {
    nums.push(Math.floor(Math.random()));
  }
  let endTime = performance.now();
  console.log(`🐌 Math.floor cost time is ${endTime - startTime} ms`, n);
  return endTime - startTime;
}

function bitwise(n) {
  const nums = [];
  let startTime = performance.now();
  for (let i = 0; i < n; i++) {
    nums.push(~~Math.random());
  }
  let endTime = performance.now();
  console.log(`🚀 double not bitwise cost time is ${endTime - startTime} ms`, n);
  return endTime - startTime;
}

// test cases
const arr = [...``.padEnd(8, `_`)].map((_, i) => i + 1);


let mathCost;
let bitwiseCosts;

for (const n of arr) {
  console.log(`\n n =`, n);
  mathCost = math(10**n);
  bitwiseCosts = bitwise(10**n);
  if(mathCost > bitwiseCosts) {
    console.log(`🚀 bitwiseCosts performance ✅`, `${mathCost - bitwiseCosts} ms`);
  } else {
    console.log(`🚀 bitwiseCosts performance ❌`, `${bitwiseCosts - mathCost} ms`);
  }
}

/*

n = 1
🐌 Math.floor cost time is 0 ms 10
🚀 double not bitwise cost time is 0 ms 10
🚀 bitwiseCosts performance ❌ 0 ms

n = 2
🐌 Math.floor cost time is 0 ms 100
🚀 double not bitwise cost time is 0 ms 100
🚀 bitwiseCosts performance ❌ 0 ms

n = 3
🐌 Math.floor cost time is 0.10000014305114746 ms 1000
🚀 double not bitwise cost time is 0.09999990463256836 ms 1000
🚀 bitwiseCosts performance ✅ 2.384185791015625e-7 ms

n = 4
🐌 Math.floor cost time is 0.6000001430511475 ms 10000
🚀 double not bitwise cost time is 0.5 ms 10000
🚀 bitwiseCosts performance ✅ 0.10000014305114746 ms

n = 5
🐌 Math.floor cost time is 2.1000001430511475 ms 100000
🚀 double not bitwise cost time is 2 ms 100000
🚀 bitwiseCosts performance ✅ 0.10000014305114746 ms

n = 6
🐌 Math.floor cost time is 24.299999952316284 ms 1000000
🚀 double not bitwise cost time is 19.700000047683716 ms 1000000
🚀 bitwiseCosts performance ✅ 4.599999904632568 ms

n = 7
🐌 Math.floor cost time is 260.7000000476837 ms 10000000
🚀 double not bitwise cost time is 232.89999985694885 ms 10000000
🚀 bitwiseCosts performance ✅ 27.800000190734863 ms

n = 8
🐌 Math.floor cost time is 2218.2999999523163 ms 100000000
🚀 double not bitwise cost time is 2133.5 ms 100000000
🚀 bitwiseCosts performance ✅ 84.79999995231628 ms


*/

image

  1. Node.js v18.12.0
"use strict";

/**
 *
 * @author xgqfrms
 * @license MIT
 * @copyright xgqfrms
 * @created 2022-07-22
 * @modified 2022-09-27
 * @modified 2023-02-25
 *
 * @description js performance.now / console.time & console.timeEnd
 * @description js 高精度时间戳 / 性能优化 / 性能测试
 * @difficulty Easy
 * @time_complexity O(n)
 * @space_complexity O(n)
 * @augments
 * @example
 * @link https://www.cnblogs.com/xgqfrms/p/16736458.html
 * @link https://www.cnblogs.com/xgqfrms/p/13360113.html
 * @solutions
 *
 * @best_solutions
 *
 */

// export {};

// const log = console.log;

function math(n) {
  const nums = [];
  let startTime = performance.now();
  for (let i = 0; i < n; i++) {
    nums.push(Math.floor(Math.random()));
  }
  let endTime = performance.now();
  console.log(`🐌 Math.floor cost time is ${endTime - startTime} ms`, n);
  return endTime - startTime;
}

function bitwise(n) {
  const nums = [];
  let startTime = performance.now();
  for (let i = 0; i < n; i++) {
    nums.push(~~Math.random());
  }
  let endTime = performance.now();
  console.log(`🚀 double not bitwise cost time is ${endTime - startTime} ms`, n);
  return endTime - startTime;
}

// test cases
const arr = [...``.padEnd(8, `_`)].map((_, i) => i + 1);


let mathCost;
let bitwiseCosts;

for (const n of arr) {
  console.log(`\n n =`, n);
  mathCost = math(10**n);
  bitwiseCosts = bitwise(10**n);
  if(mathCost > bitwiseCosts) {
    console.log(`🚀 bitwiseCosts performance ✅`, `${mathCost - bitwiseCosts} ms`);
  } else {
    console.log(`🚀 bitwiseCosts performance ❌`, `${bitwiseCosts - mathCost} ms`);
  }
}

// $ npx ts-node ./bitwise.js

/*

 n = 1
🐌 Math.floor cost time is 0.006722211837768555 ms 10
🚀 double not bitwise cost time is 0.004005908966064453 ms 10
🚀 bitwiseCosts performance ✅ 0.0027163028717041016 ms

 n = 2
🐌 Math.floor cost time is 0.022320985794067383 ms 100
🚀 double not bitwise cost time is 0.012080907821655273 ms 100
🚀 bitwiseCosts performance ✅ 0.01024007797241211 ms

 n = 3
🐌 Math.floor cost time is 0.06562280654907227 ms 1000
🚀 double not bitwise cost time is 0.06358790397644043 ms 1000
🚀 bitwiseCosts performance ✅ 0.002034902572631836 ms

 n = 4
🐌 Math.floor cost time is 2.4454171657562256 ms 10000
🚀 double not bitwise cost time is 0.4441249370574951 ms 10000
🚀 bitwiseCosts performance ✅ 2.0012922286987305 ms

 n = 5
🐌 Math.floor cost time is 2.1531789302825928 ms 100000
🚀 double not bitwise cost time is 9.519854068756104 ms 100000
🚀 bitwiseCosts performance ❌ 7.366675138473511 ms

 n = 6
🐌 Math.floor cost time is 27.88270592689514 ms 1000000
🚀 double not bitwise cost time is 26.50640892982483 ms 1000000
🚀 bitwiseCosts performance ✅ 1.3762969970703125 ms

 n = 7
🐌 Math.floor cost time is 311.6624939441681 ms 10000000
🚀 double not bitwise cost time is 310.0898230075836 ms 10000000
🚀 bitwiseCosts performance ✅ 1.5726709365844727 ms

 n = 8
🐌 Math.floor cost time is 2778.75008392334 ms 100000000
🚀 double not bitwise cost time is 2850.9339730739594 ms 100000000
🚀 bitwiseCosts performance ❌ 72.1838891506195 ms

*/

/*

function math(n) {
  const nums = [];
  let startTime = performance.now();
  for (let i = 0; i < n; i++) {
    nums.push(Math.floor(Math.random()));
  }
  let endTime = performance.now();
  // console.log(`🐌 Math.floor cost time is ${endTime - startTime} ms`, n);
  return `${endTime - startTime} ms`;
}

function bitwise(n) {
  const nums = [];
  let startTime = performance.now();
  for (let i = 0; i < n; i++) {
    nums.push(~~Math.random());
  }
  let endTime = performance.now();
  // console.log(`🚀 double not bitwise cost time is ${endTime - startTime} ms`, n);
  return `${endTime - startTime} ms`;
}


// test cases
// const arr = [...``.padEnd(10, `_`)].map((_, i) => i + 1);
const arr = [...``.padEnd(8, `_`)].map((_, i) => i + 1);

const mathCosts = [];
const bitwiseCosts = [];

for (const n of arr) {
  // console.log(`\n n =`, n);
  mathCosts.push(math(10**n));
  bitwiseCosts.push(bitwise(10**n));
}

console.log(`🐌 Math.floor performance`, mathCosts);
console.log(`🚀 bitwiseCosts performance`, bitwiseCosts);

*/

refs

https://developer.mozilla.org/en-US/docs/Web/API/Performance

https://developer.mozilla.org/en-US/docs/Web/API/Performance/measure

https://developer.mozilla.org/en-US/docs/Web/API/Performance/mark

https://www.sitepoint.com/measuring-javascript-functions-performance/

https://levelup.gitconnected.com/different-ways-to-measure-performance-in-javascript-94785075ab96

https://stackoverflow.com/questions/313893/how-to-measure-time-taken-by-a-function-to-execute

(🐞 反爬虫测试！打击盗版⚠️）如果你看到这个信息, 说明这是一篇剽窃的文章，请访问 https://www.cnblogs.com/xgqfrms/ 查看原创文章！

©xgqfrms 2012-2021

www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！

原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！

posted @ 2020-07-22 13:16  xgqfrms  阅读(308)  评论(4)  编辑  收藏  举报