After searching, I couldn't find a satisfactory answer to my question about when to use ngShow
versus ngIf
.
- Alternative to ng-show/-hide or how to load only relevant section of DOM
- What is the difference between ng-if and ng-show/ng-hide
- When to favor ng-if vs. ng-show/ng-hide?
While I understand the distinctions between these directives, I am uncertain which is the better choice for an application with numerous conditional UI elements such as content, toolbar buttons, drop-downs, form fields, etc., some of which are in ngRepeats
. As the user interacts with the application and different content gets loaded into the UI, these conditions will be evaluated regularly rather than just once like with user preferences or permissions. Additionally, much of the conditionally displayed content includes {{bindings}}
. My concern with ngShow
is the potential increase in watches, while my worry with ngIf
lies in the significant number of DOM manipulations.
Is there a recommended best practice for this scenario? Are there specific guidelines or a threshold where one directive is more suitable than the other? Or is it simply a matter of experimenting with both options to determine their respective performance impacts?