Html. Вывод больших таблиц с ленивой подгрузкой. Как?

Question

[Александр Таратин]

Нужен аналог https://clusterize.js.org/ (такой же простой и легкий) но с функцией ленивой подгрузки в стиле.

tableRenderer.dataFactory = function(offset, limit){
return new Promise(...);
}

или просто

tableRenderer.dataFactory = function(offset, limit, callback){
callback(['hello world']);
}

Финальное число элементов известно.
Число строк не более 100 000.
Плюсом будет возможность указать шаблон, с помощью которого рендерить данные.
Поддержка старых браузеров не требуется, достаточно последнего хрома.

Answer 1

[VoidVolker]

1. Создать плавающий "фрейм" для рендера видимых элементов в дерево минус и плюс экран (т.е., если видимо на экране 10 элементов с номерами 10-20, то в дерево рендерим элементы 0-10 и 20-30).
2. По мере прокрутки страницы элементы за пределами фрейма удаляем из дерева, а недостающие элементы добавляем.

Таким способом можно без тормозов рулить хоть миллиардом элементов (памяти бы хватило). Рендеринг больше сотни элементов уже создает ощутимые лаги при прокрутке. Так что всегда лучше ограничиваться минимальным числом элементов.