使用Benchmark.js和jsPerf分析代码性能

标签: benchmark javascript jsperf | 发表时间:2015-08-24 08:30 | 作者:trigkit4
分享到:
出处:http://segmentfault.com/blogs

前言

前端开发中,掌握好浏览器的特性进行有针对性的性能调优是一项基本工作,同时,比较不同代码的执行速度也是一项关键的工作。

比如,当我们想比较 RegExptest方法和 String对象的 indexOf方法查找字符串谁的速度更快的话, js代码在不同的浏览器,不同的操作系统环境运行的效率可能是不一样的,这就是为什么我们需要对其进行基准测试,在做基准测试方面,我们可以使用 Benchmark.js和使用 jsPerf(一个基于 JSLitmus的基准测试库)。我们可以使用 jsPerf来分享你的基准测试。

Benchmark.js 的使用

github 地址: https://github.com/bestiejs/benchmark.js

我们在很多 github 开源项目中,往往都能看到 benchmark文件夹,比如下面这个:

图片描述

于是 Google之,发现这是用来做基准测试的。于是乎:

首先我们在系统根目录下,通过 npm intsall benchmark 来安装 benchmark。该模块会被写入 node_modules文件夹中,我们在 test.js文件中通过 require方法引入该模块。

将如下代码写入 test.js文件,该文件置于系统根目录下:

  var Benchmark = require('benchmark');
var suite = new Benchmark.Suite;

// 添加测试
suite.add('RegExp#test', function() {
    /o/.test('Hello World!');
})
    .add('String#indexOf', function() {
        'Hello World!'.indexOf('o') > -1;
    })
// add listeners
    .on('cycle', function(event) {
        console.log(String(event.target));
    })
    .on('complete', function() {
        console.log('Fastest is ' + this.filter('fastest').pluck('name'));
    })
// run async
    .run({ 'async': true });

然后在终端执行 node test.js 可见输出结果如下:

  ➜  ~ git:(master) ✗ node test.js
RegExp#test x 9,847,928 ops/sec ±1.47% (83 runs sampled)
String#indexOf x 23,366,017 ops/sec ±0.91% (96 runs sampled)
Fastest is String#indexOf

结果最快的就是 String对象的 indexOf方法,其中, Ops/sec 测试结果以每秒钟执行测试代码的次数( Ops/sec)显示,这个数值越大越好。除了这个结果外,同时会显示测试过程中的统计误差,以及相对最好的慢了多少(%)

call和apply的比较

  var Benchmark = require('benchmark');
var suite = new Benchmark.Suite;
var arr1 = function (str) {
    return [].slice.apply(str);
};
var str2 = function (str) {
    return [].slice.call(str);
};
// 添加测试
suite.add('arr1', function() {
    arr1('test');
})
    .add('str2', function() {
        str2('test');
    })
// add listeners
    .on('cycle', function(event) {
        console.log(String(event.target));
    })
    .on('complete', function() {
        console.log('Fastest is ' + this.filter('fastest').pluck('name'));
    })
// run async
    .run({ 'async': true });

输出如下内容:

  arr1 x 596,505 ops/sec ±1.14% (95 runs sampled)
str2 x 627,822 ops/sec ±1.27% (92 runs sampled)
Fastest is str2

jsPerf 的使用

jsPerf 提供了一个简便的方式来创建和共享测试用例,并可以比较不同 JavaScript代码段的性能。 jsPerf也是基于 Benchmark来运行的。

打开 jsPerf站点: http://jsperf.com/,先将必填的项目填了。其中, slug是短名称,会生成一个网址,因此不可与别人的重复。然后在 Code snippets to compare 区域填入 title和用于测试的code。最后点击 save test case 完成验证即可。浏览器会自动跳转到测试页面

Async选项框是用来测试一些异步调用的性能的,我们的代码没有使用异步方法,所以不必勾选。

运行测试

点击“ Run tests”按钮开始测试两种算法的性能。建议在运行性能测试之前,关闭无关的浏览器页面,关闭其他程序,退出不必要的后台进程,以保证结果不受其他环境的影响。你也可以通过点击个别测试用例的名字单独运行这个例子

点击该链接查看性能比较: http://jsperf.com/huang

jsPerf还会统计所有运行过这个测试用例的浏览器的比较结果,显示在下方的 Browserscope区域,可以通过它直观地看出各个版本浏览器的性能横向和纵向比较情况。

图片描述

可以看到 Firefox下的执行速度明显高于 Chrome

查看别人的测试用例

我们可以通过 http://jsperf.com/browse 浏览最新提交的250项最新测试用例。我们也可以使用底部的 Revisions来查看不同的版本,也就是不同浏览器的测试用例情况。

总结

John Resig 在其博文 JavaScript 基准测试的质量 中提到,应该尽量考虑到每个测试结果的误差并去减小它。扩大测试的样本值,健全的测试执行,都能够起到减少误差的作用。

相关 [benchmark.js jsperf 分析] 推荐:

使用Benchmark.js和jsPerf分析代码性能

- - SegmentFault 最新的文章
前端开发中,掌握好浏览器的特性进行有针对性的性能调优是一项基本工作,同时,比较不同代码的执行速度也是一项关键的工作. 比如,当我们想比较 RegExp的 test方法和 String对象的 indexOf方法查找字符串谁的速度更快的话, js代码在不同的浏览器,不同的操作系统环境运行的效率可能是不一样的,这就是为什么我们需要对其进行基准测试,在做基准测试方面,我们可以使用 Benchmark.js和使用 jsPerf(一个基于 JSLitmus的基准测试库).

竞品分析

- MooM - 网易用户体验设计中心博客
关于竞品分析,之前天行(@天行Aeros)有篇文章《设计公式:简单有效的竞品分析》已经进行了介绍,本文在该文章的基础之上再进行一些分享,希望对大家有用. 竞品分析(Competitive Analysis)一词最早源于经济学领域. 市场营销和战略管理方面的竞品分析是指对现有的或潜在的竞争产品的优势和劣势进行评价.

Excel-对比图分析(差异分析)

- - CSDN博客数据库推荐文章
本文摘自作者《网站数据分析:数据驱动的网站管理、优化和运营 》: http://item.jd.com/11295690.html. 对比分析就是将两个或两个以上的数据进行比较,分析它们之间的差异,从而揭示这些数据所代表事物的发展变化情况和规律. 通过对比,可以很直观地看出事物在某方面的差距,并且可以准确、量化地表示出差距的多少.

Netty代码分析

- LightingMan - 淘宝JAVA中间件团队博客
Netty提供异步的、事件驱动的网络应用程序框架和工具,用以快速开发高性能、高可靠性的网络服务器和客户端程序[官方定义],整体来看其包含了以下内容:1.提供了丰富的协议编解码支持,2.实现自有的buffer系统,减少复制所带来的消耗,3.整套channel的实现,4.基于事件的过程流转以及完整的网络事件响应与扩展,5.丰富的example.

分析帝转世

- JoyLee - Lzhi's Views
纪晓岚与和珅的经典对白(和绅说得是实话啊). 本文网址:http://www.lzhi.org/views/652030. 欢迎加入500人超级QQ群:108869281,交流最新好文章.

fqueue初步分析

- tangfl - 淘宝JAVA中间件团队博客
    fqueue是国产的一个类似memcacheq,kestrel这样的支持memcached协议的轻量级开源MQ. http://code.google.com/p/fqueue/downloads/list,介绍和特点都可以看主页,我就不废话了.     今天老大提到, co了源码看了下,写个初步分析报告.

GFS架构分析

- zou - NOSQL Notes
Google文件系统(Google File System,GFS)是构建在廉价的服务器之上的大型分布式系统. 它将服务器故障视为正常现象,通过软件的方式自动容错,在保证系统可靠性和可用性的同时,大大减少了系统的成本. GFS是Google云存储的基石,其它存储系统,如Google Bigtable,Google Megastore,Google Percolator均直接或者间接地构建在GFS之上.