Как добавить элементы в DOM без замирания браузера?

Question

[ILoveYAnny]

Здравствуйте, мне нужно вывести n-ое количество блоков, когда их слишком много, браузер замирает. Я использую appendTo(). Как можно этого избежать?

Comments

[Андрей Токмаков]

Ну может быть если их сильно много, то логично, что он замирает?

[ILoveYAnny]

Андрей Токмаков: Как по вашему работают агрегаторы, которые подгружают огромное количество информации?) Браузер у меня просто замерает. Логично предположить, что нужно реализовать laizyLoading, но мб нативный метод есть.

[Алексей Ярков]

ILoveYAnny:

Как по вашему работают агрегаторы, которые подгружают огромное количество информации?

Они частями грузят инфу, а не 100500 элементов за итерацию ))

[Сергей delphinpro]

составляйте строку и добавляйте ее разом.
или добавляйте элементы во враппер вне DOM, а потом враппер со всеми элементами сразу вставляйте в DOM

[Сергей delphinpro]

Каждая манипуляция с DOM заставляет браузер перерисовывать страницу. толко и всего.

[ILoveYAnny]

Сергей: Решил проблема, постепенной подгрузкой. Спасибо.

Answer 1

[Денис Артамонов]

В любом случае, если блоков много, то браузер замрёт, т.к. он занимается обработкой данных .. - вешайте лоадер
-----
Если Вы при каждом получении блока сразу его аппендите в дом - это плохо.
Нужно сначала сформировать весь список блоков и вставить список в дом.

Comments

[ILoveYAnny]

Я пробовал сначала сформировать разметку, результат тот-же(
Спинер у меня есть, и всё было бы отлично если бы спинер не замирал. Замирает спинер и вкладка :(

[Денис Артамонов]

Вероятнее всего, Вам нужно изменить Подход к обработке добавляемой информации
---
Может опишите задачу конкретнее?

[ILoveYAnny]

Денис Артамонов: Нужно получить данные, создать полоски плееров и заполнить их данными. Таких элементов может быть 100 и больше

[Денис Артамонов]

ILoveYAnny:
1. Заранее известно какое будет количество элементов, которые хотим подгрузить?
2. Почему нельзя разбить подгрузку на меньшие части, 100/4 ?
3. Источник, откуда подгружаем 100 элементов - быстро отдает по ним информацию?

[ILoveYAnny]

Денис Артамонов:
1) Заранее до загрузки с сервера нет, однако перед append уже известно
2) Я только что об это подумал)
3) Выделенный сервер, который стоит у меня под рукой. Канал правда не промышленный, но пока хватает.

Я думаю самый удачный способ, подгружать штук по 20, Спасибо за помощь)

Answer 2

[Mikhail Osher]

document.createFragment

Comments

[ILoveYAnny]

Вы думаете будет работать не так как AppendTo() ?)