Критично ли влияет большое количество повторяющегося js-кода на скорость загрузки страницы?

Question

[Даниил Постнов]

На сайте интернет магазина, на странице "Все товары", в каждом товаре в теге script присутствует такой код:

$(document).ready(function(){
    $('#buy10769').blur(
        function (){
           $.ajax({
	       url: "/include/section/add-easy-cart.php",
               type: "POST",
	      data: ({id : 10769, quantity : this.value}),	 
              success: function(res)  {
              }
           });

	if ($("#buy10769").val()>0) {
	document.getElementById('reload-cart').click();
}

});

});

Товаров на странице 540. Критично ли для загрузки страницы такое количество скриптов?

Answer 1

[RidgeA]

Сложно сказать критично ли, но то, что плохо и что можно сделать лучше - 100%

Answer 2

[Александр]

Основная проблема в том, что используются анонимные функции, соответственно каждый раз когда они объявляются - занимают соответствующее место в памяти.

Answer 3

[Alexander Shaykin]

Соблюдайте DRY и помимо меньшего кол-ва кода будет меньше ошибок.

Answer 4

[Даниил Постнов]

Проверил. На странице 540 товаров, в каждом товаре 1 скрипт в 17 строчек.

С очисткой кэша страница грузилась 18.5 сек.
С подгруженным кэшем 10 сек.
+ Была недоступна для событий, тормозила, отрисовывала dom еще секунд 15

После снятия всех обработчиков и назначения одного - тормозов и долгого рендеринга не замечено.
Без кэша - 8сек.
С кэшем - 5.3 сек.

Пойду-ка я перепишу код где повторяющийся скрипт в 60 строк :-)