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…