how to measure function performance in javascript

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

const t1 = performance.now();

// do somethings

const t2 = performance.now();

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()

demos

"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();

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



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


how to measure function performance in javascript的更多相关文章

  1. Function Currying in javascript 的一些注释

    理解函数柯里化(Function Currying ),最关键的是理解下面这个函数: function curry(fn){ var args = Array.prototype.slice.call ...

  2. [Javascript] Required function arguments in Javascript

    In Javascript, all function arguments are optional by default. That means if you ever forget to pass ...

  3. 知识点摸清 - - function()——JavaScript 函数名后什么时候加括号,什么时候不

    加括号——调用函数 只要是要调用函数执行的,都必须加括号. 此时,function()实际上等于函数的返回值.(没有返回值也已经执行了函数体内的行为).就是说,只要加括号的,就代表将会执行函数体代码. ...

  4. JavaScript Array methods performance compare

    JavaScript Array methods performance compare JavaScript数组方法的性能对比 env $ node -v # v12.18.0 push vs un ...

  5. 【JavaScript】JS_Object跟Function的区别

    JS_Object和Function的区别 我们本次的解释,主要通过下图 粗看该图,估计你不一定能看明白.不过接下来让我逐行向你解释. 最左侧:意思是,有两个对象f1和f2,他们是通过new Foo( ...

  6. [从jQuery看JavaScript]-匿名函数与闭包(Anonymous Function and Closure)【转】

    (function(){ //这里忽略jQuery所有实现 })(); 半年前初次接触jQuery的时候,我也像其他人一样很兴奋地想看看源码是什么样的.然而,在看到源码的第一眼,我就迷糊了.为什么只有 ...

  7. javascript 匿名函数的理解,js括号中括function 如(function(){})

    代码如下: (function(){  //这里忽略jQuery所有实现  })();  (function(){ //这里忽略jQuery所有实现 })(); 半年前初次接触jQuery的时候,我也 ...

  8. Javascript中Function,Object,Prototypes,__proto__等概念详解

    http://anykoro.sinaapp.com/2012/01/31/javascript%E4%B8%ADfunctionobjectprototypes__proto__%E7%AD%89% ...

  9. JavaScript基础知识(JSON、Function对象、原型、引用类型)

    19.JSON 概念:JavaScript 对象表示法(JavaScript Object Notation),是一种轻量级的数据交换格式  特点:易于程序员编写和查看:易于计算机解析和生成 数据结构 ...

随机推荐

  1. ubuntu14.04 LEMP(linux+nginx+mysql+php5)构建环境

    Install LEMP (Linux, Nginx, MySQL and PHP) Stack on Ubuntu Linux 14.04 LTS by VIVEK GITE on DECEMBER ...

  2. git的使用学习笔记--项目版本操作

    一.使用场景 版本回退:上线失败--需要回退到上个版本 二.操作 先编辑  vim text.txt git status git add .       这个命令能看到所有的增加操作 git com ...

  3. 阿里云弹性公网IP那些事 阿里云云栖号 6月1日 弹性公网IP是独立的公网IP资源,可以绑定到阿里云专有网络VPC类型的ECS、NAT网关、私网负载均衡SLB上,并可以动态解绑,实现公网IP和ECS、NAT网关、SLB的解耦,满足灵活管理的要求。阿里云弹性公网IP那些事 阿里云云栖号 6月1日 弹性络VPC类型的E

    阿里云弹性公网IP那些事 阿里云云栖号 6月1日 弹性公网IP是独立的公网关.私网负载均衡SLB上,并可以动态解绑,实现公网IP和ECS.NAT网关.SLB的解耦,满足灵活管理的要求.

  4. https://www.cnblogs.com/AloneSword/p/3209653.html

    proc/sys/net/ipv4/下各项的意义 - 孤剑 - 博客园 https://www.cnblogs.com/AloneSword/p/3209653.html

  5. 线性DP总结(studying

    写在前面 虽然都说线性DP是入门,但我还是今天才开始学 线性DP就是珂以通过线性处理得出答案的一种DP 每一种状态都可以从前面推得,并且推导过程是呈线性的 参考题单(本人现在主要用luogu,所以这些 ...

  6. redis性能优化、内存分析及优化

    redis性能优化.内存分析及优化 1.优化网络延时 2.警惕执行时间长的操作 3.优化数据结构.使用正确的算法 4.考虑操作系统和硬件是否影响性能 5.考虑持久化带来的开销 5.1 RDB 全量持久 ...

  7. 关于base64编码Encode和Decode编码的几种方式--Java

    Base64是一种能将任意Binary资料用64种字元组合成字串的方法,而这个Binary资料和字串资料彼此之间是可以互相转换的,十分方便.在实际应用上,Base64除了能将Binary资料可视化之外 ...

  8. jvm学习第二天

    0.垃圾回收概述 1.什么是垃圾,怎么判断? 1.1引用计数法 含义 顾名思义,此种算法会在每一个对象上记录这个对象被引用的次数,只要有任何一个对象引用了此对象,这个对象的计数器就+1,取消对这个对象 ...

  9. Pytest(2)使用和调用方法

    Pytest执行用例规则 Pytest在命令行中支持多种方式来运行和选择测试用例 1.对某个目录下所有的用例 pytest 2.对模块中进行测试 pytest test_mod.py 3.对文件夹进行 ...

  10. 掌握数位dp

    最近遇到了数位dp题目,于是就屁颠屁颠的跑过来学习数位dp了~ "在信息学竞赛中,有这样一类问题:求给定区间中,满足给定条件的某个D 进制数或此类数的数量.所求的限定条件往往与数位有关,例如 ...