Предметы виртуальной прокрутки cdk

Question

Я заметил, что когда я поместил itemSize виртуальной прокрутки cdk в меньшее значение, время загрузки страницы почти удваивается.

Есть огромная разница между <cdk-virtual-scroll-viewport [itemSize]="45" а также <cdk-virtual-scroll-viewport [itemSize]="20"(таблица с 2k строк).

У меня вопрос, почему загрузка страницы идет от 2 секунд до почти 5 секунд? Как это может быть такая большая разница?

Answer 1

[itemSize] определяет, какой высоты в пикселях имеет каждая строка в списке.

Затем виртуальный скроллер использует это (частично), чтобы определить, сколько строк он может буферизовать выше и ниже области просмотра. Чем меньше рост вы делаете itemSizeЧем больше он будет пытаться загрузить и буферизировать.

Относительно

почему загрузка страницы идет от 2 секунд до почти 5 секунд?

кто знает; это полностью зависит от того, что представляет собой ваш реальный код и что создает список и что связывает, что может вызвать RecalcStyle и так далее. Возможно, у вас есть какой-то процесс, который повторяет ваш список в O (n²), например, или, может быть, есть группа слушателей событий. Нам нужно больше деталей, чтобы проанализировать это.