Проблема производительности StencilJS с Angular - PullRequest
0 голосов
/ 05 ноября 2019

Моя команда использует смесь компонентов Angular и StencilJS в нашем приложении. На некоторых из наших страниц представлен список элементов (с обычным Angular *ngFor), и длина этого списка может варьироваться от нескольких до, возможно, тысячи или более.

При переходе кНа странице отображается счетчик ожидания занятости, указывающий «система обрабатывает». Затем данные отображаются (либо бит за раз, либо все сразу - это не имеет значения), а затем счетчик должен исчезнуть, как показано на этой временной диаграмме:

enter image description here

На практике для большего количества предметов (скажем, несколько сотен или более) рендеринг выглядит следующим образом: enter image description here

Другими словами, спиннерпоявляется, затем исчезает, и через значительное количество секунд (до 25 секунд, пропорционально длине списка) данные, наконец, отображаются!

Я выделил это на использование компонентов StencilJS для создания HTML-таблицы-подобная сущность: замена этого либо для (a) простого HTML <table>, либо (b) эквивалентного углового компонента <my-table> показывает желаемую синхронизацию на первом графике.

Пара замечаний:

  • Причина желания чего-то другого, кроме простого HTML <table>, заключается в том, что столь сложный CSS может быть инкапсулирован в сущность.
  • Каждая строка таблицы не особенно сложна: возможно, от 3 до 5 столбцов, содержащих только текст.

Означает ли это, что мы используем StencilJS неправильно, или действительно существует такое снижение производительности за его использование?

...