Javascript性能测试，测试您的浏览器的性能如何

最新推荐文章于 2024-08-30 14:13:47 发布
最新推荐文章于 2024-08-30 14:13:47 发布
阅读量295 收藏
点赞数
分类专栏： JAVASCRIPT 文章标签： 测试 javascript 浏览器 date button function

Javascript性能测试是一个公开的在线测试服务，用来测试JS的执行速度。从各种常用指令的执行速度上，衡量浏览器Javascript性能。点击测试页面中的“Run all tests”即可开始测试。如果是IE内核浏览器，可能执行的時候会出现警告，按继续执行就可以了，不过要等久一点。

说明：测试结果是毫秒，测试耗时越小说明浏览器的网页显示速度越快。

以下是测试浏览器的网页代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Javascript performance test</title>

<style>
   body, span{font-family: verdana, sans serif; font-size: 12px;}
   input{margin-right: 20px;}
   span{padding-left: 20px;}
</style>
<script>
  
  
   var start;
   var end;
   var forLoopTime = 0;
   var addTime = 0;
   var subtractTime = 0;
   var multiplyTime = 0;
   var divideTime = 0;
   var divide2Time = 0;
   var fromArrayTime = 0;
   var parseIntTime = 0;
   var varTime = 0;
   var sinTime = 0;
   var floorTime = 0;
   var ifTime = 0;
   var readGlobalTime = 0;
   var concatStringsTime = 0;
   var sortArrayTime = 0;
  
   gValue = 123;
  
   var continueAfter = false;

   function testFor()
   {
    start = new Date();
    for (var i=0; i<=1000000; i++)
    {
     void(0);
    }
    end = new Date();
    forLoopTime = end-start;
    var textElem = document.createTextNode(forLoopTime + 'ms ')
    document.getElementById('forResult').appendChild(textElem);
    completed();
   }
  
   function testAdd()
   {
     var value1=123;
     var value2=234;
     var value3;
     start = new Date();
     for (var i=0; i<=1000000; i++)
     {
      value3 = value1 + value2;
     }
     end = new Date();
     addTime = end-start;
     var textElem = document.createTextNode(addTime + 'ms ')
     document.getElementById('addResult').appendChild(textElem);
     completed();
   }
  
   function testSubtract()
   {
     var value1=123;
     var value2=234;
     var value3;
     start = new Date();
     for (var i=0; i<=1000000; i++)
     {
      value3 = value2 - value1
     }
     end = new Date();
     subtractTime = end-start;
     var textElem = document.createTextNode(subtractTime + 'ms ')
     document.getElementById('subtractResult').appendChild(textElem);
     completed();
   }
  
   function testMultiply()
   {
     var value1=123;
     var value2=234;
     var value3;
     start = new Date();
     for (var i=0; i<=1000000; i++)
     {
      value3 = value2 * value1
     }
     end = new Date();
     multiplyTime = end-start;
     var textElem = document.createTextNode(multiplyTime + 'ms ')
     document.getElementById('multiplyResult').appendChild(textElem);
     completed();
   }
  
   function testDivide()
   {
     var value1=123;
     var value2=234;
     var value3;
     start = new Date();
     for (var i=0; i<=1000000; i++)
     {
      value3 = value2 / value1
     }
     end = new Date();
     divideTime = end-start;
     var textElem = document.createTextNode(divideTime + 'ms ')
     document.getElementById('divideResult').appendChild(textElem);
     completed();
   }
  
   function testDivide2()
   {
     var value1=123;
     var value2=234;
     var value3;
     start = new Date();
     var temp= (1 / value1);
     for (var i=0; i<=1000000; i++)
     {
      value3 = value2 * temp
     }
     end = new Date();
     divide2Time = end-start;
     var textElem = document.createTextNode(divide2Time + 'ms ')
     document.getElementById('divide2Result').appendChild(textElem);
     completed();
   }
  
  
  
   function testFromArray()
   {
     var value3;
     var value4 = new Array(1,2,3,4,5,6,7,8,9,10)
     start = new Date();
     for (var i=0; i<=1000000; i++)
     {
      value3 = value4[6]
     }
     end = new Date();
     fromArrayTime = end-start;
     var textElem = document.createTextNode(fromArrayTime + 'ms ')
     document.getElementById('fromArrayResult').appendChild(textElem);
     completed();
   }
  
   function testParseInt()
   {
     var value3;
     start = new Date();
     for (var i=0; i<=1000000; i++)
     {
      value3 = parseInt(123.23)
     }
     end = new Date();
     parseIntTime = end-start;
     var textElem = document.createTextNode(parseIntTime + 'ms ')
     document.getElementById('parseIntResult').appendChild(textElem);
     completed();
   }
  
   function testVar()
   {
     start = new Date();
     for (var i=0; i<=1000000; i++)
     {
      var a=1; var b=2; var c=3;
     }
     end = new Date();
     varTime = end-start;
     var textElem = document.createTextNode(varTime + 'ms ')
     document.getElementById('varResult').appendChild(textElem);
     completed();
   
   }
  
   function testSin()
   {
    var value3;
    start = new Date();
    for (var i=0; i<=1000000; i++)
    {
     value3 = Math.sin(.1)
    }
    end = new Date();
    sinTime = end-start;
    var textElem = document.createTextNode(sinTime + 'ms ')
    document.getElementById('sinResult').appendChild(textElem);
    completed();   
   }
  
   function testFloor()
   {
    var value3;
    start = new Date();
    for (var i=0; i<=1000000; i++)
    {
     value3 = Math.floor(43.341)
    }
    end = new Date();
    floorTime = end-start;
    var textElem = document.createTextNode(floorTime + 'ms ')
    document.getElementById('floorResult').appendChild(textElem);
    completed();   
   }
  
   function testIf()
   {
    var value1=123;
    start = new Date();
    for (var i=0; i<=1000000; i++)
    {
     if (value1<12)
     {
      void(0);
     }
    }
    end = new Date();
    ifTime = end-start;
    var textElem = document.createTextNode(ifTime + 'ms ')
    document.getElementById('ifResult').appendChild(textElem);
    completed();   
   }
  
   function testReadGlobal()
   {
    var value
    start = new Date();
    for (var i=0; i<=1000000; i++)
    {
     value = gValue;
    }
    end = new Date();
    readGlobalTime = end-start;
    var textElem = document.createTextNode(readGlobalTime + 'ms ')
    document.getElementById('readGlobalResult').appendChild(textElem);
    completed();   
   }
  
   function testConcatStrings()
   {
    var string1 = 'abcdefghijklmnopqrstuvxyz'
    var string2 = 'abcdefghijklmnopqrstuvxyz'
    var string3;
    start = new Date();
    for (var i=0; i<=1000000; i++)
    {
     string3 = string1 + string2;
    }
    end = new Date();
    concatStringsTime = end-start;
    var textElem = document.createTextNode(concatStringsTime + 'ms ')
    document.getElementById('concatStringsResult').appendChild(textElem);
    completed();   
   }
  
   function testSortArray()
   {
    var theArray = new Array;
    for(i=0; i<=10000; i++)
     theArray[i] = parseInt(Math.random()*10000)
    start = new Date();
     theArray.sort();
    end = new Date();
    sortArrayTime = end-start;
    var textElem = document.createTextNode(sortArrayTime + 'ms ')
    document.getElementById('sortArrayResult').appendChild(textElem);
    completed();   
   }
  
  
   function completed()
   {
    if(continueAfter)
    {
    if(forLoopTime==0)
     setTimeout('testFor()',10);
    else
     if(addTime==0)
      setTimeout('testAdd()',10);
     else
      if(subtractTime==0)
       setTimeout('testSubtract()',10);
      else
       if(multiplyTime==0)
        setTimeout('testMultiply()',10);
       else
        if(divideTime==0)
         setTimeout('testDivide()',10);
        else
         if(divide2Time==0)
          setTimeout('testDivide2()',10);
         else
          if(fromArrayTime==0)
           setTimeout('testFromArray()',10);
          else
           if(parseIntTime==0)
            setTimeout('testParseInt()',10);
           else
            if(varTime==0)
             setTimeout('testVar()',10);
            else
             if(sinTime==0)
              setTimeout('testSin()',10);
             else
              if(floorTime==0)
               setTimeout('testFloor()',10);
              else
               if(ifTime==0)
                setTimeout('testIf()',10);
               else
                if(readGlobalTime==0)
                 setTimeout('testReadGlobal()',10);
                else
                 if(concatStringsTime==0)
                  setTimeout('testConcatStrings()',10);
                 else
                  if(sortArrayTime==0)
                   setTimeout('testSortArray()',10);
                  else
                   continueAfter=false;
     }
   
    if(forLoopTime!=0&&addTime!=0&&subtractTime!=0&&multiplyTime!=0&&divideTime!=0&&divide2Time!=0&&fromArrayTime!=0&&parseIntTime!=0&&varTime!=0&&sinTime!=0&&floorTime!=0&&ifTime!=0&&readGlobalTime!=0&&concatStringsTime!=0&&sortArrayTime!=0)
    {   
     averageTime = (forLoopTime+addTime+subtractTime+multiplyTime+divideTime+divide2Time+fromArrayTime+parseIntTime+varTime+sinTime+floorTime+ifTime+readGlobalTime+concatStringsTime+sortArrayTime)/15;
     document.getElementById('averageResult').innerHTML = '<b>' + parseInt(averageTime) + 'ms</b>';
    }
   }
  
</script>
</head>

<body>
<form>
<input type="button" value="for-loop" οnclick="testFor()">1000000 times:<span id="forResult"></span><br>
<input type="button" value="add" οnclick="testAdd()">1000000 times: <span id="addResult"></span><br>
<input type="button" value="subtract" οnclick="testSubtract()">1000000 times:<span id="subtractResult"></span><br>
<input type="button" value="multiply" οnclick="testMultiply()">1000000 times:<span id="multiplyResult"></span><br>
<input type="button" value="divide" οnclick="testDivide()">1000000 times:<span id="divideResult"></span><br>
<input type="button" value="divide2" οnclick="testDivide2()">1000000 times:<span id="divide2Result"></span><br>
<input type="button" value="get value from array" οnclick="testFromArray()">1000000 times:<span id="fromArrayResult"></span><br>
<input type="button" value="parseInt()" οnclick="testParseInt()">1000000 times:<span id="parseIntResult"></span><br>
<input type="button" value="var" οnclick="testVar()">1000000 times:<span id="varResult"></span><br>
<input type="button" value="Math.sin()" οnclick="testSin()">1000000 times:<span id="sinResult"></span><br>
<input type="button" value="Math.floor()" οnclick="testFloor()">1000000 times:<span id="floorResult"></span><br>
<input type="button" value="if" οnclick="testIf()">1000000 times:<span id="ifResult"></span><br>
<input type="button" value="read global variable" οnclick="testReadGlobal()">1000000 times:<span id="readGlobalResult"></span><br>
<input type="button" value="concatenate strings" οnclick="testConcatStrings()">1000000 times:<span id="concatStringsResult"></span><br>
<input type="button" value="sort Array" οnclick="testSortArray()"><span id="sortArrayResult"></span><br>
<br>
<input type="button" value="Run all tests" οnclick="continueAfter=true;completed()">Average time: <span id="averageResult"></span>

</form>


</body>
</html>

diaocisco
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
sheep.js:JavaScript性能测试库
05-11
Sheep.js是用于在浏览器中运行性能测试的简单工具。 例子 测试一个简单的功能： sheep . test ( { name : "How fast is Math.random()?" , test : Math . random } ) ; 用参数测试一个函数： sheep . test ( { ...
浏览器性能测试工具RoboHornet.zip
07-19
Google刚刚发布了RoboHornet，这是一个浏览器的性能测试工具，不仅可以测试Javascript还包括很多其它项目，比如布局性能和localStorage。Google将其在GitHub开源，希望社区和开发者能参与到开发中来。 Google称现在...
测试JavaScript性能
Bloxed_shangyc的博客
12-30 1156
console.time("test1");**代码段**console.timeEnd("test1");可以看出执行这段代码的时间
怎样测试 JavaScript 的函数性能
高先生的猫
07-30 497
通过衡量执行某个函数所花费的时间，以“证明”某些实现比另一些实现更高效始终是一个很好的主意。这也是确保性能在进行一些修改后不受影响并找出瓶颈的好方法。 良好的性能有助于获得良好的用户体验。良好的用户体验能够留住用户。像此研究所示，由于性能差的用户体验，88％ 的在线消费者回头的可能性较小问题。 所以重要的是能够识别代码中的瓶颈并进行评估改进。特别是在为浏览器开发JavaScript时，重要的是应该意识到，你编写的每一行JavaScript都可能会阻塞 DOM，因为它是单线程语言。 在本文中，我...
测试JS性能
jie1521836的博客
07-19 2211
I. 简介 在服务器端领域，对于代码的性能一般都会有所要求。而V8引擎非常的强大，很多时候并不需要我们去做额外的优化工作，但是我们仍然会想去了解更多编写的js代码执行的细节： 想列出来所有执行时长超过300ms的函数该怎么做？ 想列出所有引擎热优化失败的函数以及优化失败的原因该怎么做呢？ 下面就想通过v8-profiler以及对应的cpu日志解析的过程，来和大家探讨下我的一些实践。 II....
3种浏览器性能测试
http://kingim.cn/
05-20 7574
1、Javascript性能测试（Google的V8 Javascript引擎） 测试地址：http://v8.googlecode.com/svn/data/benchmarks/v6/run.html            谷歌浏览器版本32    IE浏览器版本11 火狐浏览器版本28 2、页面加载速度测试（Nontroppo） 测试地址：http
前端js性能测试工具(JSLitmus)的使用
水痕
06-28 5153
一、js下载地址二、页面中引入js<script src="./JSLitmus.js"></script>三、测试数据<div id="domTestWrap"> <div class="dom-test-content"> <span class="dom-test-text"></span> </div> <div class="dom-test-con
Lighthouse（灯塔）—— Chrome浏览器强大的性能测试工具
Hei, Welcome To vickie's Blog，Good Good Study, Day Day Up ~
11-27 9337
详细介绍chrome浏览器的Lighthouse使用方法，及测试结果分析解读
10大主流性能测试工具推荐
公众号已改名为-程序员阿沐
09-13 2301
有你不知道的
浏览器Javascript性能测试网址
Yanjun Lee's Blog
02-29 2058
  SunSpider JavaScript Benchmark http://wd-testnet.world-direct.at/mozilla/dhtml/funo/jsTimeTest.htm
前端性能优化学习 03 Web 性能测试
皮蛋很白的博客
05-13 1930
Web 性能测试 作为网站应用的开发者或维护者，我们需要时常关注网站当前的健康状况，譬如在主流程运行正常的情况下，各方面性能体验是否满足期望，是否存在改进与提升的空间，如何进行快速且准确的问题定位等，为了满足这些诉求，我们需要进行全面且客观的性能检测。 性能检测的认知 性能检测作为性能优化过程中的一环，它的目的通常是给后续优化工作提供指导方向、参考基线及前后对比的依据。性能检测并不是一次性执行结束后就完成的工作，它会在检测、记录和改进的迭代过程中不断重复，来协助网站的性能优化不断接近期望的效果。 在展开介绍
Web模型与性能测试的研究分析
07-05
Web模型与性能测试的研究分析： Web的起源与发展： Web是互联网上的一种应用，它起源于1989年，由英国科学家蒂姆·伯纳斯-李提出。Web的发展经历了多个阶段，从最初简单的文档分享，到如今包括多媒体交互、社交网络...
自己写的javascript性能测试插件
03-24
JavaScript性能测试插件是用于评估和优化JavaScript代码执行效率的工具。通过自定义这样的插件，我们可以更好地理解和改进我们的Web应用程序在不同环境下的表现。在这个项目中，我们有两个主要文件：`t1.html`和`...
浏览器性能测试JavaScript脚本
04-17
2. `raytrace.js`：该脚本模拟了光线追踪算法，用于测试浏览器在处理图形和图像渲染方面的性能，对JavaScript引擎的计算能力和内存管理有较高要求。 3. `crypto.js`：这是一个加密测试，使用了各种加密算法，如SHA-...
软件测试学习笔记丨Pytest配置文件
ceshiren_com的博客
08-27 2196
pytest.ini是pytest的配置文件；可以修改pytest的默认行为；不能使用任何中文符号，包括汉字、空格、引号、冒号等。
数据导出为Excel接口报错：java.io.IOException: UT010029: Stream is closed
一起coding，一起嗨。
08-27 406
数据导出为Excel接口报错：java.io.IOException: UT010029: Stream is closed
鸿蒙Next 单元测试框架——hypium
最新发布
qq_39431405的博客
08-30 556
单元测试框架(hypium)是HarmonyOS上的测试框架，提供测试用例编写、执行、结果显示能力，用于测试系统或应用接口。表1 单元测试框架功能特性。
8款常见的自动化测试开源框架
2301_78276982的博客
08-28 802
在如今开源的时代，我们就不要再闭门造车了，热烈的拥抱开源吧！本文针对性能测试、Web UI 测试、API 测试、数据库测试、接口测试、单元测试等方面，为大家整理了github或码云上优秀的自动化测试开源项目，希望能给大家带来一点帮助。
谷粒商城实战-264-商城业务-订单服务-订单登录拦截
epitomizelu的专栏
08-26 827
preHandle: 在控制器方法执行之前被调用。postHandle: 在控制器方法执行之后，但在视图渲染之前被调用。: 在整个请求处理完成之后被调用，包括视图渲染。提供了一个强大的机制来扩展 Spring MVC 应用程序的功能。通过实现这些方法，你可以轻松地添加诸如身份验证、日志记录、性能监控等功能，而无需修改现有的控制器代码。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值