Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

(accordion) Should use ngAfterContentInit for better performance ?

See original GitHub issue

I just realize NgbAccordion use ngAfterContentChecked to populate initial state: https://github.com/ng-bootstrap/ng-bootstrap/blob/master/src/accordion/accordion.ts#L178

This is not good for performance, because ngAfterContentChecked will be triggered in every change detection.

Maybe I missed something, but I think we should use ngAfterContentInit instead of ngAfterContentChecked.

Issue Analytics

State:
Created 6 years ago
Comments:7 (7 by maintainers)

Top GitHub Comments

1reaction

pkozlowski-opensourcecommented, Jun 21, 2017

If that is the reason, I may suggest create a setter for activeIds input and trigger update inside setter

This is not enough as closeOthers needs to be taken into account as well. So it would have to be a setter. Same goes for any property that influences internal state of the accordion. Multiplying those setters results in code that is super-hard to maintain.

Given this I would much rather focus on making this component OnPush which would have even better perf characteristics. But then again, I’m not sure if this is priority unless we’ve got real-life proof of the ngAfterContentChecked() method in accordion being a perf bottleneck.

0reactions

pkozlowski-opensourcecommented, Aug 18, 2017

Cannot get real-life proof yet. Will keep an eye on it.

Cleaning up issues in preparation for 1.0 release so I’m going to close this one for now. Please comment back / open a new issue if anything is not performing as expected in real-life applications.

Top Results From Across the Web

Angular2: @ContentChild - only immediate children

@ContentChildren( myTitle, {descendants: false}) myTitle: QueryList<myTitle>; ngAfterContentInit() { console.log(this.myTitle.

Angular Lifecycle Hooks: ngOnChanges, ngOnInit, and more

ngDoCheck fires with every change detection cycle. Angular runs change detection frequently. Performing any action will cause it to cycle.

Accordion Test in blogger

Accordion Test in blogger · 1. It is entirely component based. · 2. Better change detection · 3. Angular2 has better performance. ·...

Accordion | carbon-components-angular

ngAfterContentInit · updateChildren. Properties. Protected _skeleton. _skeleton: boolean = false. Defined in src/accordion/accordion.component.ts:36 ...

AfterContentInit - Angular

A lifecycle hook that is called after Angular has fully initialized all content of a directive. Define an ngAfterContentInit() method to handle any...