Как сделать оптимизацию показа блоков?

Сейчас у меня на странице загружается более 550 блоков с контентом и загрузка страницы занимает долгое время, а на телефоне так тем более по wi-fi. Я пробовал выводить по 25 блоков с помощью пагинации wordpress и у меня получилось. Но было проблема: фильтр искал блоки только на открытой странице. Получается он искал только из 25 блоков, а все остальные блоки он не брал, т.к. они были на других страницах. И у меня возник вопрос: Как оптимизировать загрузку страницы и отображать не все 550 блоков разом, но чтобы фильтр искал из всех имеющихся.

Думал сделать как-то это с помощью скриптов может можно? Выводить не все сразу, но прогружать их или по страницам или просто появлениям при долистывании до конца. Вот кстати сам скрипт фильтра:

// Фильтрация программ
    function applyFilters() {
    // Инициализация классов
    var direction1 = $("#direction1").val();
        var level1 = $("#level1").val();
        var universities = $("#universities").val();
        var language = $("#language").val();
        var program = $("#program").val();
        // Создания селектора
        var selector = "#card-wrapper-first ." + direction1 + "." + level1 + "." + program + "." + language + "." + universities;

  // Появление нового запроса
  $('#card-wrapper-first .card-item').hide();
  $(selector).show();
}

Он берёт класс выбранных option и сверяет их с классами на блоках после нажатия на кнопку "Подобрать". Надеюсь на ваше дружелюбие и, конечно, помощь :) Большое спасибо!