jQuery选择器的性能测试(5)

来源:未知 责任编辑:责任编辑 发表时间:2014-01-25 11:35 点击:

            });
        }
 });
 
})(jQuery);

 


调试了几组方法:
$("id");

$("class");

$("id class");

$("class","id");

$("id").find("class");

发现并没有太大的差别;然后查看了一下代码,原来是因为工具函数里面用了eval()方法。

eval()到底有多耗性能?下面做个简单的测试(调用9998次后所需的时间(ms)):

 \

 

通过几次测试之后,eval()这个方法的所耗时间竟然是$("id")的18--19倍。

这也是为什么eval()方法需要谨慎使用的原因。

 


如果直接用上面的工具函数来测试jQury方法的性能,实在有点不够直观,

所以可以改用下面的方法来测试:


[javascript]
$.lt(); 
for(i=1; i<9999; i++){ 
    $('#test1');     

$.lt(); 
$.lt();
for(i=1; i<9999; i++){
 $('#test1'); 
}
$.lt();当然在使用上没有封装好的方法那么方便,但因为不需要调用eval()方法,所以测出的数值更为直观。

下面再做几个测试,js部分代码如下:


[javascript]
$(document).ready(function () { 
    $.extend($, { 
        lt: function () { 
            if (this.ltLastTime == null) { 
                return this.ltLastTime = new Date().getTime(); 
            } 
            var diff = new Date().getTime() - this.ltLastTime; 
            this.ltLastTime = null; 
            return diff; 
        }, 
        ltLastTime: null 
    }); 
             
    $.lt(); 
    for(i=1; i<99999; i++){ 
        document.getElementById("test"); 
    } 
    console.log("getElementById('test'):", $.lt());      
    //$("id");  
    $.lt(); 
    for(i=1; i<99999; i++){ 
        $('#test');  

发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
用户名: 验证码:点击我更换图片
最新评论 更多>>

推荐热点

  • Gb2312转utf-8编码的方法(vbs+js)
  • 如何使用Ajax技术开发Web应用程序(1)
  • js跳转路径问题
  • JavaScript模仿桌面窗口
  • 用js检测两个线段是否相交
  • 我知道的JavaScript -- 设计模式(桥接)应用之 – 验证器
  • 运用JavaScript构建你的第一个Metro式应用程序(on Windows
  • 我是如何去了解jquery的(六),案例之幻灯片轮换
  • Jquery封装幻灯片效果
网站首页 - 友情链接 - 网站地图 - TAG标签 - RSS订阅 - 内容搜索
Copyright © 2008-2015 计算机技术学习交流网. 版权所有

豫ICP备11007008号-1