Angular — Utilizing custom pure pipe to improve performance

Pipe is a powerful feature in Angular to achieve data transformation in templates.

@Pipe({name: 'trim'})
export class TrimPipe implements PipeTransform {
transform(value: string): string {
return value.trim();
}
}
@Component({
template: `{{ value | trim }}`,
...
})
export class AppComponent {...}

However, not many Angular developers like working with custom pipe due to the fact that it is more heavy weighted than a static Util class, with more codes to write, classes…