javascript / intermediate
Snippet
Optimizing Performance with Pure Pipes
By default, Angular pipes are 'pure'. This means the transform method is only called if the input arguments change. This prevents expensive calculations from running on every change detection cycle, significantly improving performance.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
@Pipe({name: 'expensiveFilter',pure: true})export class FilterPipe implements PipeTransform {transform(items: any[], term: string): any[] {return items.filter(item => item.name.includes(term));}}
angular
Breakdown
1
pure: true
Tells Angular to only re-run the pipe if the identity of 'items' or 'term' changes.
2
transform(items: any[], term: string)
The core logic that filters the array based on the provided search term.