how to measure function performance in javascript
how to measure function performance in javascript
Performance API
- Performance Timeline API
- Navigation Timing API
- User Timing API
- 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的更多相关文章
- Function Currying in javascript 的一些注释
理解函数柯里化(Function Currying ),最关键的是理解下面这个函数: function curry(fn){ var args = Array.prototype.slice.call ...
- [Javascript] Required function arguments in Javascript
In Javascript, all function arguments are optional by default. That means if you ever forget to pass ...
- 知识点摸清 - - function()——JavaScript 函数名后什么时候加括号,什么时候不
加括号——调用函数 只要是要调用函数执行的,都必须加括号. 此时,function()实际上等于函数的返回值.(没有返回值也已经执行了函数体内的行为).就是说,只要加括号的,就代表将会执行函数体代码. ...
- JavaScript Array methods performance compare
JavaScript Array methods performance compare JavaScript数组方法的性能对比 env $ node -v # v12.18.0 push vs un ...
- 【JavaScript】JS_Object跟Function的区别
JS_Object和Function的区别 我们本次的解释,主要通过下图 粗看该图,估计你不一定能看明白.不过接下来让我逐行向你解释. 最左侧:意思是,有两个对象f1和f2,他们是通过new Foo( ...
- [从jQuery看JavaScript]-匿名函数与闭包(Anonymous Function and Closure)【转】
(function(){ //这里忽略jQuery所有实现 })(); 半年前初次接触jQuery的时候,我也像其他人一样很兴奋地想看看源码是什么样的.然而,在看到源码的第一眼,我就迷糊了.为什么只有 ...
- javascript 匿名函数的理解,js括号中括function 如(function(){})
代码如下: (function(){ //这里忽略jQuery所有实现 })(); (function(){ //这里忽略jQuery所有实现 })(); 半年前初次接触jQuery的时候,我也 ...
- Javascript中Function,Object,Prototypes,__proto__等概念详解
http://anykoro.sinaapp.com/2012/01/31/javascript%E4%B8%ADfunctionobjectprototypes__proto__%E7%AD%89% ...
- JavaScript基础知识(JSON、Function对象、原型、引用类型)
19.JSON 概念:JavaScript 对象表示法(JavaScript Object Notation),是一种轻量级的数据交换格式 特点:易于程序员编写和查看:易于计算机解析和生成 数据结构 ...
随机推荐
- CentOS7.9静默安装Oracle19C软件
CentOS7.9静默安装Oracle19C软件 Oracle发布了支持的版本.可以看到了Oracle11gR2和Oracle12C.一直到2022年就不支持patch和服务.(感慨Oracle 11 ...
- 标准PE头属性说明
- loj10018数的划分
题目描述 将整数 n 分成 k 份,且每份不能为空,问有多少种不同的分法.当 n=7,k=3 时,下面三种分法被认为是相同的:1 1 5;1 5 1 ;5 1 1 输入格式 一行两个数 n ,k . ...
- Vue3(三)CND + ES6的import + 工程化的目录结构 = 啥?
突发奇想 这几天整理了一下vue的几种使用方式,对比之后发现有很多相似之处,那么是不是可以混合使用呢?比如这样: vue的全家桶和UI库,采用传统的方式加载(CND.script). 自己写的js代码 ...
- vue项目中如何引用tinymce
最近公司在做一个CMS系统的项目,其中富文本编辑框用的很多,目前流行的也很多,包括wangEditor.TinyMCE.百度ueditor.kindeditor.CKEditor等.经过自己的一番翻箱 ...
- TCP IP SOCKET 笔记
网络由下往上分为 物理层.数据链路层.网络层.传输层.会话层.表示层和应用层. 通过初步的了解,我知道IP协议对应于网络层,TCP协议对应于传输层,而HTTP协议对应于应用层, 三者从本质上来说没有可 ...
- VMware Workstation Pro下载
VMware Workstation Pro 下载地址:https://pan.baidu.com/s/1XXhFFh0Fx0vzvcd1A543Yg,提取码:2o19(下载得到的压缩包中含有 VMw ...
- CCF CSP 202012-1 期末预测之安全指数
202012-1 期末预测之安全指数 题目背景 期末要到了,小菜同学找到了自己的好朋友顿顿,希望可以预测一下自己这学期是否会挂科. 题目描述 首先,顿顿选取了如"课堂表现".&qu ...
- linux(9)find命令详解
find命令格式: find path -option [ -print ] [ -exec -ok command ] {} \; find命令的参数: path:要查找的目录路径. ~ 表示$HO ...
- PIE模型
首先,我们需要明确程序的Bug有如下的定义: 1. Fault/Defect 静态的,存在于软件中的缺陷.例如:一段有缺失或者错误的代码. 2. Error 运行时一种不正确的中间状态. 3. Fai ...