@Ismail-1

Почему подвисают дочерние компоненты vue?

Добрый вечер!

Есть компонент лента с бесконечной прокруткой и выводом в ней постов.
Заголовок, фото, и еще немного текста.

При изначальной загрузки компонента в массив
ads_arr = заносятся 30 постов с БД и отрисовываются циклом.
И при вызове дочерних компонентов в этом компоненте они выводятся без задержки, все срабатывает нормально.

Затем при прокрутки страницы в этот массив добавляются новые 30 постов и отрисовываются и так пока не закончатся посты в БД.

И вот как этот массив увеличивается, и посты отрисовываются например если уже отрисованно 100 постов, то дочерние компоненты начинают вызываться с задержкой и пропадает плавность при вызове, начинают тормозить при вызове.

Когда я смотрю ленту в ВК или Инстаграм, там тоже лента увеличивается выводятся новые посты, но там не видно чтоб была какая то задержка.

Как правильно это можно реализовать чтоб не было задержки, подскажите пожалуйста, любые подсказки
Спасибо
  • Вопрос задан
  • 76 просмотров
Решения вопроса 1
@null_object
Тормозить начинает из-за большого количества нод в dom дереве. Решается использование "виртуального скролла", суть которого заключается в отрисовки только видимых элементов.

Подробнее - https://www.patterns.dev/vanilla/virtual-lists

Утилита для Vue - https://vueuse.org/core/useVirtualList/
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы