Flying

Это происходит из-за неправильной организации работы с HTTP.

Вы запрашиваете данные через XMLHttpRequest методом GET и по тому же url, что и сама страница. В результате получается, что у вас один и тот же HTTP метод и один и тот url отдают два разных ответа в зависимости от... непойми чего (видимо проверяется заголовок X-Requested-With), но это явно не то, что описано в спецификации HTTP.

Ключевым моментом, естественно, является то, что запрос идёт методом GET. Если вы читали спецификацию HTTP или хотя бы статьи о протоколе HTTP, то должны помнить, что метод GET является идемпотентным. Из этого следует что клиент (в данном случае - браузер), имеет полное право (если разрешают условия кэширования) ожидать, что он получит тот же ответ на этот запрос и может оптимизировать это, использовав уже имеющийся в кэше результат. Именно это и происходит.

Убедиться в том, что это так, можно очень просто: достаточно открыть dev.tools и на вкладке Network включить опцию "Disable cache". После этого вы увидите что проблема исчезла.

Правильным решением будет выделение API для XHR запросов фильтра в отдельный endpoint. Также логичнее будет использовать метод POST, а не GET.

Если же не хочется переделывать - хотя бы добавьте к XHR запросам ещё один query параметр, например xhr=1 и убедитесь что он никогда не появляется в url страниц. Это сделает ваши url для страниц и XHR запросов разными и уберёт проблему.

Также имеет смысл пересмотреть объём данных, передаваемых в ответ на каждый запрос, ведь вам нужны только значения, передавать постоянно почти 100кб текста описаний нет особого смысла, они у вас и так уже есть.

Подобная функциональность - идеальный кейс для использования IntersectionObserver. Добавляете observer на элементы, соответствующие вашим экранам, определяете пороговое значение срабатывания - и дальше просто реагируете на события переходов между состояниями.

Конечно возможны нюансы с тем что, к примеру, несколько (больше двух) ваших страниц попадут во viewport (помним что мониторы можно развернуть и вертикально, получив высоту viewport'а в 2k пикселей), но в целом получается весьма стабильно работающая схема.

Дополнительный плюс в том что вам не нужно заниматься отслеживанием события scroll т.к. это и сложнее в реализации и менее надёжно и есть связанные с ним проблемы (подробнее в документации)

Ошибка довольно очевидна, хотя и размазана по коду. Однако причина её появления - в том что вы плохо понимаете те механизмы которые пытаетесь использовать. Другими словами это ошибка не техническая, а ошибка от недостатка знаний.

Ваш текущий код работает по причине того что вы используете неявное создание нового объекта на каждый вызов через указание new Date() в качестве значения по-умолчанию. Это значение по-умолчанию вас и сбивает с толку т.к. оно выглядит как своеобразный генератор значений, хотя по факту им не является.

Кроме того await date тоже по факту работает не совсем так как вы (скорее всего) ожидаете. Из MDN: "If the value of the expression following the await operator is not a Promise, it's converted to a resolved Promise." Таким образом const currDate = await date в вашем случае эквивалентно const currDate = date.

Далее, следите за руками:

Сначала вы передаёте в setInterval функцию без дополнительных аргументов. Она работает по причинам, описанным выше.

Затем вы передаёте в setInterval() значение вызова setSearchTime() третьим аргументом (т.е. аргументом для интервальной функции). При этом, как вы сами пишете - функция setSearchTime() у вас возвращает Promise что по определению - обещание вернуть одно значение.

Таким образом когда вы передаёте этот третий аргумент - ваша функция начинает получает значение аргумента date (т.е. перестаёт отрабатывать генерация значения по-умолчанию). При первом вызове ваш Promise, переданный в качестве аргумента в интервальную функцию, переходит в состояние fulfilled и отдаёт значение, но дальше этого уже не будет происходить т.к. Promise уже в состоянии fulfilled, так что вы будете всегда получать одно и то же значение. Однако это будет происходить не потому что setInterval не работает, а потому что вы и передаёте одно значение.

Если вы (сами или из описания выше) понимаете как всё это работает на самом деле - то решение проблемы становится очевидным: вам всего лишь нужно передавать в вашу функцию setCurrTime не значение времени, а функцию-генератор времени. Тогда её вызов на каждой итерации будет приводить к созданию нового значения времени и всё начнёт работать.

Также пара замечаний которые не относятся непосредственно к вашему вопросу, но являются важными:

1. Ваша функция отображает время с точностью до минуты, но вызывается каждые 100 миллисекунд. Таким образом она 600 раз генерирует одно и то же значение что, очевидно, неразумно
   
2. Сама функция преобразования времени у вас не показана, но важно чтобы эта функция не опиралась на setInterval в качестве источника информации о количестве прошедшего времени. Вместо этого вы должны всегда отталкиваться от new Date() и модифицировать этот объект. В качестве примера почему так попробуйте себе представить что компьютер с браузером в котором запущен ваш скрипт, был отправлен в гибернацию на какое-то время, а потом вернулся назад
   

Можно воспользоваться тем фактом что в JavaScript в reduce()передаётся текущий индекс и сам массив, это позволяет упростить backreference. В итоге у меня получилось нечто подобное:

/**
 * @param {Array} list
 * @return {string}
 */
const range = list => list
    .sort((a,b) => a - b)
    .reduce((r, v, i, a) => {
        if (i > 0 &&  v - a[i - 1] === 1) {
            let l = r.pop();
            l.push(v);
            r.push(l);
        } else {
            r.push([v]);
        }
        return r;
    }, [])
    .map(v => v.length > 1 ? `${v.shift()}-${v.pop()}` : v)
    .join(', ');

Кусок с pop/push можно ускорить за счёт усложнения обращения к массивам, но так код получается выразительнее.

Отдельное спасибо Дмитрий за .sort((a,b) => a - b) - не знал

asort, arsort, uasort

В JavaScript есть 6 примитивных типов данных, не имеющих методов: boolean, null, undefined, Number, String, Symbol. Тем не менее для примитивного типа String разрешается вызов методов объекта String, в этом случае просто создаётся временный объект String со значением примитивного типа.

Вообще рекомендую JavaScript Guide на MDN, там много интересного.