$(document).on('scroll' ...
эта штука срабатывает при КАЖДОМ событии скролла. А их может быть ОЧЕНЬ много. Чтобы убедиться можете добавить console.log() и посмотреть на флуд.
Почитайте про throttle/debounce
Идем дальше:
$('#firstScroll').each(function() { ...
$('#box6').each(function() { ...
WTF? У вас там множество элементов с одинаковым id?
И каждый раз вы ищете в DOM эти элементы, и для каждого высчитываете одни и те-же данные
$(document).scrollTop() + windowHeight
Почему не найти элементы заранее, не сделать вычисления общие вычисления один раз для всех?
Лезем глубже:
if (скролл больше чего-то там) {|
какойтоЭлемент.addClass('fadeInTop').fadeIn(700);
}
Серьезно? То есть доскроллили до нужного места, все красиво появилось, крутим колесо дальше, и продолжаем дальше спамить .addClass().fadeIn() по много раз в секунду? Ну зашибись.
P.S.: сори что немного грубо, на пришлось вашу кашу прогонять через
jsbeautifier, а то кровь из глаз начала идти.
