Can I optimize signal usage in Angular templates when using a getter?

I have a service that exposes a signal through a getter. The getter is used directly in the HTML template, but I am concerned about performance. Since Angular's change detection calls the getter on every re-render, I suspect this could lead to inefficiencies.

Here is my current implementation: Service:

signal = signal();
getSignal() {
return this.signal;
}


Template:

<h1>
{{ service.getSignal()() }}
</h1>



My questions are:

• Is it inefficient to use a getter in this context because it is recalculated on every re-render?
• Can this issue be avoided by storing the signal in a class variable or another approach?
• Does Angular optimize this internally, making this a non-issue?

Continue reading...