js中使用Timer来计时程序执行时 - [javascript] - [开发]
在我们开发过程中,我们也在不断的学习,以及优化自己的代码质量。
我们时常需要一个计时器,来对代码某段或者某些段执行进行计时,以评估代码运行质量,考虑是否优化。 以及优化后的直观对比。
JavaScript中,console已经向我们提供了方便的计时方法。 - Timer
为了计算特定操作的时耗,console对象中引入了对计时器的支持。
用法很简单:
开始计时:
console.time()方法,我们只需要给定一个string作为唯一参数即可,该字符串也就是我们计时器的名字。
停止计时,并打印出执行时耗:
console.timeEnd()方法,只需要把计时器的名字传入作为参数即可。
“暂停”
你可能会需要在中间打“断点”,例如,点击按钮调用一个方法的耗时。
console.timeLog方法,同样只需要传如计时器名称。
示例
console.time("answer time");
alert("Click to continue");
console.timeLog("answer time");
alert("Do a bunch of other stuff...");
console.timeEnd("answer time");
将记录用户解除警报框所需的时间,将时间记录到控制台,等待用户解除第二个警报,然后将结束时间记录到控制台:

特别需要注意的是,time,timeEnd,timeLog 都需要同一个字符串作为参数,来构造同一个计时器。 而页面上最多可以同时运行10,000个计时器。
我们用到的最多的console.time()和console.timeEnd()方法,打在执行代码段的两头
js中使用Timer来计时程序执行时 - [javascript] - [开发]的更多相关文章
- 在Angular.js中的H5页面调用Web api时跨域问题处理
/// <summary> /// 被请求时 /// 在Angular.js中的H5页面调用Web api时跨域问题处理 /// </summary> /// <para ...
- js中一个标签在按顺序执行没有被读取到时可以用window.onload
<%@LANGUAGE="JAVASCRIPT" CODEPAGE="65001"%> <!DOCTYPE html PUBLIC " ...
- 链接脚本在编程中的高级运用之二——执行时库和C++特性支持
我们在链接脚本在编程中的高级运用之中的一个可变长数组中已经讲述了编译链接的原理,并且以uboot命令为例具体介绍链接脚本怎样实现可变长数组. 本章在前者的基础上继续讲述链接脚本在执行时库中的高级应用技 ...
- springMVC框架在js中使用window.location.href请求url时IE不兼容问题解决
是使用springMVC框架时,有时候需要在js中使用window.location.href来请求url,比如下面的路径: window.location.href = 'forecast/down ...
- js中页面加载完成后执行的几种方式及执行顺序
1:使用jQuery的$(function){}; 2:使用jquery的$(document).ready(function(){});前两者本质上没有区别,第1种是第2种的简写方式.两个是docu ...
- js中页面加载完成后执行的几种方法及执行顺序
在js和jquery使用中,经常使用到页面加载完成后执行某一方法.通过整理,大概是五种方式(其中有的只是书写方式不一样). 1:使用jQuery的$(function){}; 2:使用jquery的$ ...
- os.popen('python hello_out.py')中Python程序执行时默认的当前路径为MS-DOS CMD的默认路径
>>> import os >>> os.getcwd() 'D:\\pythonCode\\pp4e' >>> os.chdir('Stream ...
- crontab 中 python(cx_Oracle)脚本执行时需要用户环境变量,怎么办??
import cx_Oracle Traceback (most recent call last): File "", line 1, in ? ImportError: lib ...
- Python程序执行时的不同电脑路径不同问题
原因:因代码转移时项目路径发生了变化,导致解释器无法找到对应路径,是的程序无法正常执行 需求: 1.我希望代码能在不同的电脑下,不必修改源代码就能正常执行(所需模块已安装的前提下) 2.我希望代码在命 ...
随机推荐
- Webpack和Gulp,Webpack和Gulp的基本区别:
Gulp和Webpack的基本区别: gulp可以进行js,html,css,img的压缩打包,是自动化构建工具,可以将多个js文件或是css压缩成一个文件,并且可以压缩为一行,以此来减少文件体积,加 ...
- 无刷新上传图片,ajax 和 iframe
iframe 上传 upload.html 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 ...
- C语言程序设计(七) 函数
第七章 函数 分而治之: 把较大的任务分解成若干较小.较简单的任务,并提炼出公用任务的方法 函数是C语言中模块化程序设计的最小单位,既可以把每个函数都看作一个模块,也可以将若干相关的函数合并成一个模块 ...
- C++ 继承函数
#include <iostream> using namespace std; class passport { public: passport() //默认构造 { } passpo ...
- 强大的Flutter App升级功能
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 应用程序升级功能是App的基础功能之一,如果没有此功能会造 ...
- 移动端Rem适配(基于vue-cli3 ,ui框架用的是vant-ui)
介绍postcss-pxtorem 是一款 postcss 插件,用于将单位转化为 remlib-flexible 用于设置 rem 基准值 1.安装lib-flexible(用于设置 rem 基准值 ...
- 雅奇880、990、小土豆调用EPX Studio 编译的DLL的编程方法~
在雅奇990中,使用“外部文件-调用链接库文件”命令实现与EP的通信,例如: 1.调用链接库文件(取项目文件信息() + '资源文件\Project1.dll', 'Unit1.rpas:Result ...
- pytorch的自动求导机制 - 计算图的建立
一.计算图简介 在pytorch的官网上,可以看到一个简单的计算图示意图, 如下. import torchfrom torch.autograd import Variable x = Variab ...
- ABP实践(4)-abp前端vue框架之简单商品增删改查(帮助刚入门的新手快速了解怎么才能加入自己的功能并运行起来)
提示:如有不明白的地方请先查看前3篇ABP实践系列的文章 1,下载及启动abp项目前后端分离(netcore+vue) 2,修改abp数据库为mysql 3,商品系列api接口(本文主要依赖在这个商品 ...
- 跟面试官侃半小时MySQL事务隔离性,从基本概念深入到实现
提到MySQL的事务,我相信对MySQL有了解的同学都能聊上几句,无论是面试求职,还是日常开发,MySQL的事务都跟我们息息相关. 而事务的ACID(即原子性Atomicity.一致性Consiste ...