[SalesForce] Is there performance degradation when using Lightning components within an aura:iteration tag

I am currently building a somewhat complex Lightning App page. I have currently encountered a requirement to optimize the page due to slowness in the page loading and filtering records using client-side interactions. During my analysis, I noticed that in several places throughout the app, we have Lightning components inside of <aura:iteration> tags. I haven't seeing this anywhere in the documentation, but could it result in performance degradation to include Lightning components in the aura:iteration tag?

Also, is there a document available anywhere outlining the best practices for optimal performance in cases like this when building apps with Lightning?

I have attached a screenshot of one code block where we have multiple components in an iteration.

Thank you for any help you can provide.

Best Answer

I have experienced similar problem. Yes, if we render components inside aura:iteration it does lead to performance problem if the components are too many/or are complex. From what I have read-and not from any documentation concretely-the reason is probably due to multiple factors like:

- aura:if tag in the component that is rendered inside iteration

-Another aura:iteration inside the component that is rendered inside iteration.

-Too many events (application events specially as they are expensive). You should use aura:method for calling methods of child components.

-If an attribute is set multiple times inside some loop.

Though removing these factors should improve performance, in my case, I only handled the case of too many events and removing aura:if tags which at least helped me get rid of the warning that performance was degrading and improved the performance gradually.