im trying to measure the performance differences in change detection strategies.
i've added the angular profiler, and checked with Default and then added onPush to most of our components and these are the results: (development mode)
Default: { msPerTick: 25+-, numTicks: 18+- } onPush: { msPerTick: 2+-, numTicks 220+- }
as you can see the msPerTick has reduced significantly, but the number of cycles is 10 times bigger. the more components i change to onPush, so the ms reduces and numTicks increases.
i want to know if it's ok and normal, and if not what can cause that?
Extra details: angular 7, im using lazy load modules(with routing). app.component is on default strategy. im checking it on the biggest module. big.module has big.home component (default) with child components (onPush)
OnPush
doesn't remove the component to the Angular's tree render list, it just doesn't update it everytime there's a change. Calling the API every five seconds is triggering the Angular's rendered to notify all those components. Using OnPush and injectingngZone
into the component you can usengZone.runoutsideangular(...)
function to actually detach the component to the angular's tree component list and so you have full control on how and when updating the component. Hence the performances should increase even more. – Jacopo Sciampi