Угловая производительность - OnPush увеличивает количество циклов

Я пытаюсь измерить различия в производительности в стратегиях обнаружения изменений.

Я добавил профилировщик angular и проверил его с помощью Default, а затем добавил onPush к большинству наших компонентов, и вот результаты: (режим разработки)

По умолчанию: {msPerTick: 25 + -, numTicks: 18 + -} onPush: {msPerTick: 2 + -, numTicks 220 + -}

как видите, msPerTick значительно уменьшился, но количество циклов в 10 раз больше. чем больше компонентов я изменяю на onPush, мс уменьшается, а numTicks увеличивается.

Я хочу знать, нормально ли это, а если нет, что может к этому привести?

Дополнительные сведения: angular 7, я использую модули отложенной загрузки (с маршрутизацией). app.component - это стратегия по умолчанию. Я проверяю это на самом большом модуле. big.module имеет компонент big.home (по умолчанию) с дочерними компонентами (onPush)


person Ori Damari    schedule 29.01.2020    source источник
comment
Как именно вы заразились этими клещами?   -  person Jacopo Sciampi    schedule 29.01.2020
comment
@JacopoSciampi Я не уверен, как проверять тики, но приложение вызывает API каждые 5 секунд, который меняет состояние (сокращение)   -  person Ori Damari    schedule 29.01.2020
comment
Хорошо, я понимаю. Изменение стратегии на OnPush не удаляет компонент из списка рендеринга дерева Angular, он просто не обновляет его каждый раз, когда происходит изменение. Вызов API каждые пять секунд запускает визуализацию Angular для уведомления всех этих компонентов. Используя OnPush и вставляя ngZone в компонент, вы можете использовать функцию ngZone.runoutsideangular(...), чтобы фактически отсоединить компонент от списка компонентов дерева angular, и таким образом вы полностью контролируете, как и когда обновлять компонент. Следовательно, производительность должна возрасти еще больше.   -  person Jacopo Sciampi    schedule 29.01.2020
comment
@JacopoSciampi Хорошо, я это тоже проверю. но есть идеи, почему numTicks так сильно выросли?   -  person Ori Damari    schedule 29.01.2020


Ответы (1)


Обновление: я понял, функция timeChangeDetection работает в течение полсекунды и пытается сделать столько циклов, сколько может. так что желаемая ситуация - это как можно больше numTicks.

person Ori Damari    schedule 29.01.2020