1

I've read that using methods in angular templates can result in performance issues even if they're simple methods (Can Calling Simple Methods in Angular Component Templates Cause Performance Issues?). Does that apply to ECMAScript defined standard built-in objects and functions (JSON, Math, Array methods, parseInt, decodeURI, etc.)?

For example, is it a problem if trees is an array and I used join() like this:

  <div>{{ trees.join(', ') }}</div>

Do I still need to use pipes (or some other strategy)?

Stucco
  • 388
  • 5
  • 21
  • 1
    Any method call is considered to be not performant, no matter what method and how "standard" it is. The main reason for it is the way change detection works: It just compares object identities and usually every method call returns a *brand new object*. Even when the object's properties have the same values, the objects are considered to be different and re-rendering is going to happen. That's the short story about why we don't call (any) methods inside templates. – Octavian Mărculescu Jul 28 '22 at 18:55
  • Cool. I was hoping angular might know if a "standard" method is a pure function and kinda act like a pipe. I guess not. – Stucco Jul 28 '22 at 19:16
  • 1
    I don’t think your example is problematic. Angular holds a reference to ‘trees’ and as long as that reference doesn’t change, angular will not need to do another call to it. So basically, I disagree with the first comment, but only for these specific cases. In general, calling (component) methods from your template IS a bad idea. – MikeOne Jul 28 '22 at 21:50

0 Answers0