Как улучшить производительность, когда у нас есть много методов для вызова

Question

Я сделал систему проверки меню, получая информацию с каждого сервера, который имеет продукты или нет. Если нет, закройте дисплей этого меню.

Мой метод: Создайте сервис для проверки продуктов каждого меню. Запустите сервис в шапке (около 60 функций для выполнения)

Проблема в следующем: Медлительность системы для получения всей информации из системы. Требуется около 20 секунд, чтобы восстановить все. (Если на странице товаров)

Мой чек продукта обслуживания.

countWhisky() {

  return this.http.post('/enviroment', {
    method: 'GET',
    uri: 'api url'
  })

}
 .
 .
 .
 about 60 function

Мой заголовок component.ts

.
.
 private checkProduct: CheckProductsService,
.
.
ngAfterViewInit() {

    this.checkProduct.countSomething().subscribe((data: any) => {
    this.somethingCheck = data.record_set
  .
  .
  .
  about 60 subscribe
}

Мой заголовок component.html

<li *ngIf="somethingCheck != ''">
  <a href="/products?brand=something">something</a>
</li>
.
.
about 60 ngIf

Как улучшить производительность в угловых 7.

Макс, спасибо

Answer 1

Я думаю, вам следует взглянуть на бесконечный список прокрутки и paginator (я использую угловой материал paginator), например, вы можете отрендерить первые 10 api, а затем, когда пользователь обновит или изменил страницу, отрендерить еще 10 api. Бесконечный список прокрутки выглядит более полезным для вас.