不同浏览器(chrome,firefox,IE)在JQuery与原生JS之执行性能比较

本次测试所用浏览器为chrome(36.0.1985.125m),firefox(31.0),IE(8.0)

1. 比较JQuery在不同浏览器对于js的执行性能

计算插入20000条div节点所需时间

    for(var i=0;i<20000;i++){
        var divTag = document.createElement(‘div‘);
        $("#chn").append(divTag);
    }

Result:

时间单位ms

chrome和firefox基本接近，IE8的性能不敢恭维。。。

2. 比较原生JS的写上的执行性能法在不同浏览器

使用JS的appendChild来替代JQuery的append

    for(var i=0;i<20000;i++){
        var divTag = document.createElement(‘div‘);
        document.getElementById("chn").appendChild(divTag);
        //$("#chn").append(divTag);

 时间单位ms

数据不忍直视啊，让JQuery重度用户情何以堪。 

chrome在原生JS执行速度上要超过firefox 2倍，与jQuery上执行相比也要快上30倍左右；

firefox在原生JS执行上相比于JQuery要快上10倍以上；

IE如果使用原生JS，则速度提高20倍；

结论：

• 如果使用JQuery开发，则chrome和firefox执行速度是差不多的。
• 如果使用原生JS开发，则chrome引擎表现是最突出的。
• 如果开发的JS运算量大，果断使用原生JS来编码，否则IE用户要崩溃了！！！

不同浏览器(chrome,firefox,IE)在JQuery与原生JS之执行性能比较,布布扣,bubuko.com