Mail.ruПочтаМой МирОдноклассникиВКонтактеИгрыЗнакомстваНовостиКалендарьОблакоЗаметкиВсе проекты

Рендеринг огромной html таблицы

Alina Denova Ученик (83), на голосовании 1 год назад
Тормозит навигация в большой html таблице (5000 строк, 20 колонок). Проблема в том, что браузер, как я понимаю, рендерит (отрисовывает) сразу всю таблицу. Есть плагины на php+javascript для кластеризации, пробовал те что нашел, самый известный clusterize, но он не поддерживает никакие элементы, кроме <p>. Писал свой на javascript, работал, но тормозила прокрутка таблицы. Подскажите пожалуйста, может кто знает хороший плагин для этих целей. (Постраничный вывод - не предлагать.)
Голосование за лучший ответ
Егор Андронов Мудрец (12501) 1 год назад
Я в хтмл не шарю вот от нейронки ответ:

Есть несколько популярных плагинов для эффективного рендеринга больших таблиц в HTML. Один из них - React Virtualized. Он предоставляет компоненты, которые рендерят только видимые строки и столбцы таблицы, что значительно улучшает производительность. Вы можете использовать его в своем проекте, чтобы оптимизировать навигацию в вашей таблице.
4MIN Мудрец (10814) 1 год назад
Действительно, рендеринг огромной html таблицы целиком может привести к медленной работе. Несколько вариантов оптимизации:

1. Использовать ajax для загрузки и рендеринга частей таблицы по запросу. Например, загружать по 20 строк сразу, а остальное загружать в фоне по мере скроллинга. Это позволит избежать одномоментного рендеринга всей таблицы.

2. Включать горизонтальную прокрутку и расширять таблицу по мере необходимости. Так проще оптимизировать рендеринг.

3. Использовать виртуальный скроллинг. То есть, рендерить только видимую часть таблицы, а остальное загружать по требованию.

4. Настроить кэширование. Если данные не меняются часто, то кэшировать уже отрендеренные фрагменты таблицы.

5. Разбить таблицу на несколько меньших по размеру и рендерить их по отдельности.

В идеале стоит использовать комбинацию перечисленных подходов, чтобы добиться оптимальной производительности. Особенно ajax + виртуальный скроллинг + кэширование.

Надеюсь это поможет!
Sergio 2.1 Оракул (67423) 1 год назад
Один из плагинов, который может помочь вам с рендерингом большой HTML-таблицы, это DataTables. Это плагин для библиотеки jQuery, который добавляет расширенные функции управления к вашим HTML-таблицам. Он обеспечивает пагинацию, мгновенный поиск, многоколоночную сортировку и многое другое. Он также легко настраивается и имеет широкий выбор расширений.

Еще один плагин, который может быть полезен для вас, это Grid.js. Это бесплатный и открытый JavaScript-плагин для таблиц. Он работает с большинством JavaScript-фреймворков, включая React, Angular, Vue и VanillaJs. Он легко устанавливается и имеет простой API для разработки продвинутых JavaScript-таблиц.
Зоркий Сокол Гуру (2885) 1 год назад
Разбить на несколько таблиц вручную - минутное дело. Просто надо знать несложный синтаксис таблиц в html.
ewe 2e¶ CoЛнЫшКоcBeTиТоЧеНЬяРкО* Высший разум (329783) 1 год назад
Вам, как обычному человеку, а не роботу, все 5000 строк вы даже не сможете окинуть одним взглядом. Вы лучше приделайте там поиск и вывод только тех строк, которые отфильтрованы в результате заданного поиска пользователя.
Похожие вопросы