zoukankan      html  css  js  c++  java
  • 性能分析工具firebug.console.profile(title)

    性能分析工具firebug.console.profile(title)

    很多的web开发人员都使用Mozilla firefox并且绝大多数都使用firebug来测试、调试前端代码,firebug在调试html+css方面的能力是毋庸置疑的,但仅仅使用它来完成这样的任务并没有发挥firebug的巨大潜能。

    JavaScript性能

    随着web apps越来越庞大,JavaScript的性能也被推到风头浪尖,在此之前或许你已经知道哪些操作会减缓JavaScript程序运行速度,并且养成良好的编码习惯。

    正如你所知道的,使用appendChild来增加Dom节点的效率要比innerHTML低下,那么为什么会这样呢?又如何验证这个观点的正确性?还有我最近发现的,在声明数组的时,应该使用数组直接量:

    1
    var arr = [];

    而不是:

    1
    var arr = new Array;

    但是我所说的,也未必是正确的吧!

    console.profile()

    这是firebug中一个很强大的方法,它可以提供给你测试代码片段执行的时间和一些性能分析数据,前提是测试的代码片段中要有function的执行,否则会提示“无任何可记录的活动”,如下图:

    一个简单的测试例子:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    function createArray1(){
        for(var i=0;i<100000;i++){
            var arr = [];
        }
    }
    function createArray2(){
        for(var i=0;i<100000;i++){
            var arr = new Array;
        }
    }
    console.profile('a');
    createArray1();
    console.profileEnd('a');
     
    console.profile('b');
    createArray2();
    console.profileEnd('b');

    直观的数据:

    console.time()

    由于createArray1和createArray2内部并没有执行其他的function,所以从上图中,我们仅仅能够得到测试代码片段执行所需的时间,如果基于仅满足这个需求,通过console.time()就完全可以实现了。

    1
    2
    3
    console.time('a');
    createArray1();
    console.timeEnd('a');

    综合的数据分析

    我们从不期盼某款浏览器,在运行自己编写程序的时候崩溃或者速度缓慢的让人抓狂,不过真的遇到了,还是应该先找到影响代码执行效率的问题所在,然后 才能针对某个算法做一些优化处理来减少JavaScript解释器的运算压力,加速程序运行。这正是profile的用武之地,透析firebug的数据 图,能让我们快速定位到测试代码执行全过程中,哪个function调用次数最多,耗时最多,从这个function的算法和各个细节入手,就可以迅速解 决问题。

    最后附上一个例子:

    1
    2
    3
    console.profile('a');
    var No = that.getBetNo();
    console.profileEnd('a');

    更加丰满的数据:

    转载:振之 

    http://www.cnblogs.com/zhenn/archive/2011/02/20/1959186.html

  • 相关阅读:
    关于win10输入法问题(打不出中文)解决方法
    Docker 修改默认存储位置
    Enabling and Mounting NFS on CoreOS
    docker run mysql
    Specified key was too long; max key length is 767 bytes mysql
    C# 实现 Snowflake算法 ID生成
    无忧之道:Docker中容器的备份、恢复和迁移
    IIS Express 虚拟目录
    从零開始学android&lt;AnalogClock与DigitalClock时钟组件.三十一.&gt;
    jquery版本号升级不兼容的问题:$(&quot;input&quot;).attr(&quot;value&quot;)功能发生改变
  • 原文地址:https://www.cnblogs.com/yuzhongwusan/p/2283814.html
Copyright © 2011-2022 走看看