Как оптимизировать скрипт?

Question

[gfr3]

Подскажите есть скрипт

$('[href=#tab]').on('shown.bs.tab', function (e) {
function resize() {
if ( $(window).width() < 992 ) { 
      $(function() {
         $('.item').matchHeight();
      });
}
}
$(window).resize(resize);
resize();
});

Но при выполнении resize браузер заметно подвисает. Можно ли както оптимизировать данный скрипт?

Answer 1

[Алексей Уколов]

Для начала, нужно вынести обработку ресайза из события табов - вы при каждом переключении ставите ещё один обработчик.

Потом, оборачивать $('.item').matchHeight() в $(function() {}) тоже не нужно. Это onLoad, в него должен быть обёрнут весь этот код.

Это даст вам 80% результата при 1% усилий:

function resize() {
  if ( $(window).width() < 992 ) {
    $('.item').matchHeight();
  }
}

$(window).resize(resize);

resize();

Оставшиеся 20% вы можете получить используя throttle / debounce.

Comments

[gfr3]

Спасибо!
Такой вопрос, а если я хочу на всех разрешениях использовать функцию

<script>
$('[href=#tab]').on('shown.bs.tab', function (e) {
$('.item').matchHeight(); 
});
</script>

или

<script>
 $(function() {
$('.item').matchHeight(); 
});
</script>

какой вариант верный?