Performance about ng-show vs. ng-hide

Question

Introduction:-

Some people are only using ng-show instead of ng-hide="!true" Or some peoples are using ng-hide instead of ng-show="!true". Technically we don't need ng-hide directive. But! I know angular introduced ng-hide for standard coding structure. And please understand me, I am asking about the performance not difference.

My Question:-

So my question is what about the performance of this following scenarios?

• ng-hide="true" vs. ng-show ="!true"
• ng-show="true" vs. ng-hide="!true";

Answer 1

No different performance between ng-hide vs ng-show. It just uses CSS to show/hide the element.

<div ng-hide="true"></div> // => display: none !important;

<div ng-hide="!true"></div> // => display: block !important;

Similar for ng-show:

<div ng-show="true"></div> // => display: block !important;

<div ng-show="!true"></div> // => display: none !important;

You should compare ng-show (show element use CSS) vs ng-if (add element to DOM) about performance.