оптимизация javascript браузера resizer для браузеров webkit

Question

Я собираюсь сохранить это короткое и сладкое. В браузерах webkit, похоже, медленный ответ с функцией автоматического resizer, которую я применил к [моему сайту] [1], кажется, что все, что кажется, появляется, когда браузер настроен. Ниже приведен фрагмент моего JS.

function setTheHeight() { 

    if($('.col-small, .img_hover').length) { 
     //Get value of highest element 
     var maxHeight = Math.max.apply(Math, $('.col-small, .img_hover').map (
      function() { 
       var totalHeight = 0; 

       $(this).children().each(function() { 
        totalHeight += $(this).outerHeight(); 
       }); 

       return totalHeight; 
      } 
     )); 
     console.log(maxHeight); 
     $('.col-small, .img_hover').height(maxHeight); 
    } 
} 

setTheHeight(); 

$(window).resize(function() { 
    setTheHeight(); 
}); 

Я что-то не хватает ???

Answer 1

попытка оптимизации, нет необходимости пересчитывать несколько раз

$('.col-small, .img_hover') 

как

.children() 

также пытаются сократить использование карты и каждый

возможно вещь, как это? :

var elems = [], $elems = $('.col-small, .img_hover'); 

$elems.each(function(i){ 
    var $t = $(this); 
    var $c = $t.children(); 
    elems[i] = { $:$t, $c:$c, nb:$c.length }; 
}); 

function getHeight(e,i){ 
    var total=0,n=0; 
    while(n < e.nb) 
     total += e.$c.eq(n++).outerHeight(); 
    return total; 
} 

function setTheHeight(){ 
    $elems.height(Math.max.apply(Math, $.map(elems,getHeight))); 
} 

$(window).resize(setTheHeight).resize(); 

$elems.find("img").on("load",setTheHeight); 

вы также можете попробовать не сделать эффективное изменение размера при каждом изменении пикселов

var timer = false; 
$(window).resize(function(){ 
    if(timer !== false) return; // or clearTimeout(timer); 
    timer = setTimeout(function(){ 
     setTheHeight(); 
     timer = false; 
    },20); // 20ms => 50fps max 
}).resize(); 

скрипку =>http://jsfiddle.net/r043v/HvmmM/