Как быстро отрисовывать таблицу с 10.000-ми строк?

Question

[jtag]

На данный момент реализованно примерно в цикле вот так:
$table.append('<td>' + array[count] + '</td>');
При выборе пользователем других значений, происходит загрузка из БД новых значений в цикле создается таблица с заполнением ячеек. Все это заметно притормаживает. Использовали быстрый jquery DataTables. Но потом от него отказались. Можно как то ускорить создание таблицы?

Comments

[sim3x]

Откуда получаются данные?
В каком колличестве?
Опишите подробно кейс

[Антон Спирин]

Все как советуют в ответах, либо бесконечный скролл с автоподгрузкой, либо пагинация.

Answer 1

[Александр Аксентьев]

не надо отрисовывать таблицу с 10000 строк, никто не работает сразу со всеми никогда. В этом вообще никакого смысла нет. (хоть один реальный случай знаете когда нужно сразу и одновременно загрузить и работать с таким количеством строк?)
Если данных много есть подгрузка при скролле, вывод постранично, фильтры для выбора небольшого набора данных и т.д.

В больших фреймворках это решается через отрисовку только того что видно на экране 10-20 строк.
Остальное на самом деле не скрыто за скроллом, а вообще не выводится на страницу.
И скролл полностью виртуальный.
https://datatables.net/extensions/scroller/example...

Comments

[jtag]

Подзагрузка при скролле - интересно, попробую реализовать, а каким способом проверить когда строки таблицы законились при скроле и нужно отобразить следующий строки?

[Александр Аксентьев]

jtag_, jsfiddle.net/brynner/QDttv

Answer 2

[0xD34F]

Очевидно, что пользователь не сможет одномоментно воспринять 10000 строк данных. То есть, сама задача - идиотская, её решать НЕ НАДО. Делайте разбиение по страницам, 30-50-100 строк будут отображаться с приемлемой скоростью.