ANGULAR 15 PURE AND IMPURE PIPE 

In this tutorial, we will see what are pure and impure pipes.
All the pipes are pure by default. Pure pipes are executed by angular when it detects pure changes like changes in input values eg. string,number, boolean etc. Also it executes when there is an object reference change eg. Array.
In other words, Pure pipes won't be executed if you are trying to add a value or update a value in the same instance of object. Only in case of object reference change the pure pipes are executed.
So in this tutorial, we have a example of an Array named as heroes which is of type class Superheros which have 2 fields 'Name' as string and 'CanFly' as boolean. We will create a custom pure pipe named as 'flyingHeroesPure' which will return all the superheroes with Canfly as true.
So here we will see that when we try to push the new value in the heros array with the same instance then the pure pipe is not executed and when we change the object reference of the array or create a new instance for the array with same values then the pure pipes detect the changes.
We will also see the impure pipes. We can mark the pipe as impure by marking the 'pure' property as false.
The impure pipes are executed with a every single change in the page like keystroke ,mouse move etc.
The impure pipes are too costly as they can seriously affect the performance of the page.
#Angular #Angular 8 #Angular 10 #Angular 12 #Angular 13 #Angular 15