当前位置: 首页 > news >正文

JavaScript 评测代码运行速度的几种方法

一、使用 performance.now() API

在 JavaScript 中,可以使用 performance.now() API 来评测代码的运行速度。该 API 返回当前页面的高精度时间戳,您可以在代码执行前后调用它来计算代码执行所需的时间。

例如:

let t0 = performance.now();// 执行需要测试的代码
for (let i = 0; i < 1000000000; i++) {// some code
}let t1 = performance.now();
console.log("Code took " + (t1 - t0) + " milliseconds.");

 

注意,performance.now() API 只在现代浏览器中可用,并且可能会受到其他因素(例如计算机性能和当前页面的负载)的影响,因此该结果只能作为相对值。

二、使用 console.time()console.timeEnd()

另一种评测 JavaScript 代码运行速度的方法是使用 console.time()console.timeEnd()。这两个方法允许您给特定代码块计时,并在代码执行后在控制台中显示计时结果。

例如:

console.time("Test code");// 执行需要测试的代码
for (let i = 0; i < 1000000000; i++) {// some code
}console.timeEnd("Test code");

 在控制台中,您将看到类似于以下内容的输出:

Test code: 824.047119140625 ms

 

使用 performance.now() API 和使用 console.time()console.timeEnd()这两种方法都可以快速评测代码的性能,但这些方法只是大致估算代码运行速度,而不是精确的性能测量工具。因此,如果需要更精确的评测,可以使用专业的性能分析工具。

三、使用第三方库

如果需要进行更严格的性能测试,您可以使用第三方库,例如 Benchmark.js 或 JSLitmus。这些库可以在多次运行代码的情况下进行测试,并以可读的方式报告结果,以便更好地评估性能。

例如,使用 Benchmark.js 进行性能测试的代码可能如下所示:

var suite = new Benchmark.Suite;// 添加测试用例
suite.add('Test code', function() {for (let i = 0; i < 1000000000; i++) {// some code}
})// 运行测试用例
.on('cycle', function(event) {console.log(String(event.target));
})
.run({ 'async': true });

 

可以使用各种配置选项,例如指定运行次数、自动运行测试等,以适应需求。通过使用这些库,可以对代码的性能进行更精确的评估,并了解其在不同浏览器和设备环境中的表现。

四、使用浏览器开发者工具

例如,如果使用 Chrome 浏览器,可以使用 Chrome 开发者工具评测代码的运行速度。

  1. 打开 Chrome 浏览器,并打开需要评测的页面。

  2. 单击浏览器的“更多工具”选项卡,然后选择“开发者工具”。

  3. 在开发者工具的“控制台”选项卡中,单击“Performance”按钮,以启动性能分析器。

  4. 单击“开始”按钮,以开始评测代码的运行速度。

  5. 在浏览器控制台中运行代码,并观察分析结果。您可以看到详细的性能分析报告,其中包括代码的 CPU 使用情况、内存使用情况、帧率等。

 

 

如使用 Firefox 浏览器,可以使用 Firefox 开发者工具评测代码的运行速度。Firefox 开发者工具的使用方法类似 Chrome 开发者工具,请参阅 Firefox 开发者工具的文档以获取更多信息。

浏览器工具是评测 JavaScript 代码运行速度的非常方便的工具。通过使用它,您可以获得有关代码性能的详细信息,并确保代码在各种环境中良好运行。

相关文章:

JavaScript 评测代码运行速度的几种方法

一、使用 performance.now() API 在 JavaScript 中&#xff0c;可以使用 performance.now() API 来评测代码的运行速度。该 API 返回当前页面的高精度时间戳&#xff0c;您可以在代码执行前后调用它来计算代码执行所需的时间。 例如&#xff1a; let t0 performance.now();…...

Linux 编译器 gcc/g++

本文已收录至《Linux知识与编程》专栏&#xff01; 作者&#xff1a;ARMCSKGT 演示环境&#xff1a;CentOS 7 目录 前言 正文 gcc/g常用命令 自定义可执行程序名命令-o 预处理指令-E 编译指令-S 汇编指令-c 链接指令gcc 命令巧记口诀 链接库 动态库-动态链接 静态库…...

2.Java基础【Java面试第三季】

2.Java基础【Java面试第三季】前言推荐2.Java基础01_字符串常量Java内部加载-上58同城的java字符串常量池面试code讲解intern()方法---源码解释02_字符串常量Java内部加载-下whyOpenJDK8底层源码说明递推步骤总结考查点03_闲聊力扣算法第一题字节跳动两数求和题目说明面试题解法…...

Java高级-多线程

本篇讲解java多线程 基本概念&#xff1a; 程序、进程、线程 **程序(program)**是为完成特定任务、用某种语言编写的一组指令的集合。即指一段静态的代码&#xff0c;静态对象。 **进程(process)**是程序的一次执行过程&#xff0c;或是正在运行的一个程序。是一个动态的过程…...

mysql高级(事务、存储引擎、索引、锁、sql优化、MVCC)

文章目录1.事务1.1 四大特性ACID1.2 并发事务2.存储引擎2.1 InnoDB2.2 MyISAM2.3 Memory2.4 存储引擎特点2.5 存储引擎的选择3.性能分析3.1 查看执行频次3.2 慢查询日志3.3 profile3.4 explain4.索引4.1 索引结构B-TreeBTreeHash面试题4.2 索引分类思考题4.3 语法4.4 使用规则最…...

Java后端开发功能模块思路

文章目录前言一、查找接口及参数信息1.1 找访问路径1.2 参数及返回结果信息1.3 编写功能模块函数二、代码设计思路三、总结前言 对于正在学习Java后端开发的同学来说&#xff0c;对于Java后端功能模块的开发过程及思路要有一个整体清晰的流程。才能保证在开发过程中更加的顺畅…...

CAPL(vTESTStudio) - DoIP - TCP发送_05

TCP发送 参数定义 版本号:02 FD or 01 FE or 其他任意值数据类型:00 05 or 00 06 or 80 01 or其他任意值数据长度:想要发送的任意长度...

使用IntelliJ IDEA搭建datax-web开发环境

记录&#xff1a;372场景&#xff1a;使用IntelliJ IDEA搭建datax-web开发环境&#xff0c;以及datax-web基本使用。版本&#xff1a;JDK 1.8Python 2.7.5datax-web开源地址&#xff1a;https://github.com/WeiYe-Jing/datax-web1.配置Maven环境1.1安装目录目录&#xff1a;D:\…...

[SSD固态硬盘技术 14] GC垃圾回收太重要了

今天介绍臭名昭著的垃圾收集 过程(或“GC”),maybe 这是对JAVA 工程师而言。当遇到GC导致速度降低时候, 他们真的想跳脚。 我想到我的小孩打疫苗,哭的哇哇叫, 在他的眼里疫苗应该也是讨厌的吧, 但事实真的如此吗? 但首先,让我们考虑一下如果根本没有 GC,闪存系统会发…...

lamada表达式、stream、collect整理

lamada表达式格式 格式&#xff1a;( parameter-list ) -> { expression-or-statements } 实例&#xff1a;简化匿名内部类的写法 原本写法&#xff1a; public class LamadaTest { public static void main(String[] args) { new Thread(new Runnable() { …...

Nacos 入门微服务项目实战

Nacos 核心源码精讲 - IT贱男 - 掘金小册全方位源码精讲&#xff0c;深度剖析 Nacos 注册中心和配置中心的核心思想。「Nacos 核心源码精讲」由IT贱男撰写&#xff0c;375人购买https://s.juejin.cn/ds/BuC3Vs9/ Hi&#xff0c;大家好&#xff0c;欢迎大家来学习《Nacos 核心源…...

【c++】类和对象:让你明白“面向一个对象有多重要”:构造函数,析构函数,拷贝构造函数的深入学习

文章目录 什么是面向对象&#xff1f;一&#xff1a;类是什么&#xff1f; 1.类的访问限定符 2.封装 3.类的实例化 4.this指针二&#xff1a;类的6个默认成员函数 1.构造函数 2.析构函数 3.拷贝构造函数什么是面向对象&#xff1f; c语言是面向…...

职场IT老手教你3步教你玩转可视化大屏设计,让领导眼前一亮!

我是制造企业的IT中心的研发人员&#xff0c;平常工作就是配合业务部门出出报表&#xff0c;选型一些商业软件&#xff0c;并在内部负责实施运维。最近领导出去参观了一些数字化转型比较领先的工厂和制造企业&#xff0c;回来就甩给我几张图&#xff0c;问能不能我们也做几个这…...

【光伏功率预测】基于EMD-PCA-LSTM的光伏功率预测模型(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…...

大数据Kylin(二):Kylin安装使用

文章目录 Kylin安装使用 一、Kylin安装要求 二、Kylin安装 1、Kylin安装前环境准备...

我们的微服务中为什么需要网关?

说起 Spring Cloud Gateway 的使用场景&#xff0c;我相信很多小伙伴都能够脱口而出认证二字&#xff0c;确实&#xff0c;在网关中完成认证操作&#xff0c;确实是 Gateway 的重要使用场景之一&#xff0c;然而并不是唯一的使用场景。在微服务中使用网关的好处可太多了&#x…...

互联网医院源码 线上问诊 智慧医院源码 C#源码

互联网医院平台源码 智慧医院管理系统源码 开发环境&#xff1a;ASP.NET C# VS2019 SQL2008 依托于实体医院利用互联网技术对接院内业务信息系统&#xff0c;向患者提供基于线上问诊、预约挂号、缴费结算、医患互动、诊后随访、健康科普和复诊等全面的医疗健康互联网服务。…...

基于昇腾计算语言AscendCL开发AI推理应用

01 初始AscendCL AscendCL&#xff08;Ascend Computing Language&#xff0c;昇腾计算语言&#xff09;是昇腾计算开放编程框架&#xff0c;是对底层昇腾计算服务接口的封装&#xff0c;它提供运行时资源&#xff08;例如设备、内存等&#xff09;管理、模型加载与执行、算子…...

JS document.write()换行

换行效果&#xff1a; 通过传递多个参数&#xff0c;即可实现换行效果&#xff1a; document.write("<br>",ar) 效果&#xff1a; 示例源码&#xff1a; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8&quo…...

Java高级-集合-Collection部分

本篇讲解java集合 集合 集合框架的概述 集合、数组都是对多个数据进行存储操作的结构&#xff0c;简称Java容器。 说明&#xff1a;此时的存储&#xff0c;主要指的是内存层面的存储&#xff0c;不涉及到持久化的存储&#xff08;.txt,.jpg,.avi&#xff0c;数据库中&#xf…...

IDEA运行Tomcat出现乱码问题解决汇总

最近正值期末周&#xff0c;有很多同学在写期末Java web作业时&#xff0c;运行tomcat出现乱码问题&#xff0c;经过多次解决与研究&#xff0c;我做了如下整理&#xff1a; 原因&#xff1a; IDEA本身编码与tomcat的编码与Windows编码不同导致&#xff0c;Windows 系统控制台…...

国防科技大学计算机基础课程笔记02信息编码

1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制&#xff0c;因此这个了16进制的数据既可以翻译成为这个机器码&#xff0c;也可以翻译成为这个国标码&#xff0c;所以这个时候很容易会出现这个歧义的情况&#xff1b; 因此&#xff0c;我们的这个国…...

系统设计 --- MongoDB亿级数据查询优化策略

系统设计 --- MongoDB亿级数据查询分表策略 背景Solution --- 分表 背景 使用audit log实现Audi Trail功能 Audit Trail范围: 六个月数据量: 每秒5-7条audi log&#xff0c;共计7千万 – 1亿条数据需要实现全文检索按照时间倒序因为license问题&#xff0c;不能使用ELK只能使用…...

VTK如何让部分单位不可见

最近遇到一个需求&#xff0c;需要让一个vtkDataSet中的部分单元不可见&#xff0c;查阅了一些资料大概有以下几种方式 1.通过颜色映射表来进行&#xff0c;是最正规的做法 vtkNew<vtkLookupTable> lut; //值为0不显示&#xff0c;主要是最后一个参数&#xff0c;透明度…...

Ascend NPU上适配Step-Audio模型

1 概述 1.1 简述 Step-Audio 是业界首个集语音理解与生成控制一体化的产品级开源实时语音对话系统&#xff0c;支持多语言对话&#xff08;如 中文&#xff0c;英文&#xff0c;日语&#xff09;&#xff0c;语音情感&#xff08;如 开心&#xff0c;悲伤&#xff09;&#x…...

Python如何给视频添加音频和字幕

在Python中&#xff0c;给视频添加音频和字幕可以使用电影文件处理库MoviePy和字幕处理库Subtitles。下面将详细介绍如何使用这些库来实现视频的音频和字幕添加&#xff0c;包括必要的代码示例和详细解释。 环境准备 在开始之前&#xff0c;需要安装以下Python库&#xff1a;…...

Device Mapper 机制

Device Mapper 机制详解 Device Mapper&#xff08;简称 DM&#xff09;是 Linux 内核中的一套通用块设备映射框架&#xff0c;为 LVM、加密磁盘、RAID 等提供底层支持。本文将详细介绍 Device Mapper 的原理、实现、内核配置、常用工具、操作测试流程&#xff0c;并配以详细的…...

算法岗面试经验分享-大模型篇

文章目录 A 基础语言模型A.1 TransformerA.2 Bert B 大语言模型结构B.1 GPTB.2 LLamaB.3 ChatGLMB.4 Qwen C 大语言模型微调C.1 Fine-tuningC.2 Adapter-tuningC.3 Prefix-tuningC.4 P-tuningC.5 LoRA A 基础语言模型 A.1 Transformer &#xff08;1&#xff09;资源 论文&a…...

MFC 抛体运动模拟:常见问题解决与界面美化

在 MFC 中开发抛体运动模拟程序时,我们常遇到 轨迹残留、无效刷新、视觉单调、物理逻辑瑕疵 等问题。本文将针对这些痛点,详细解析原因并提供解决方案,同时兼顾界面美化,让模拟效果更专业、更高效。 问题一:历史轨迹与小球残影残留 现象 小球运动后,历史位置的 “残影”…...

tauri项目,如何在rust端读取电脑环境变量

如果想在前端通过调用来获取环境变量的值&#xff0c;可以通过标准的依赖&#xff1a; std::env::var(name).ok() 想在前端通过调用来获取&#xff0c;可以写一个command函数&#xff1a; #[tauri::command] pub fn get_env_var(name: String) -> Result<String, Stri…...