Bird
0
0

Identify the performance issue in this Angular component:

medium📝 Debug Q7 of 15
Angular - Performance Optimization
Identify the performance issue in this Angular component:
@Component({
  selector: 'app-timer',
  template: `{{ currentTime() }}`
})
export class TimerComponent {
  currentTime() {
    return new Date().toLocaleTimeString();
  }
}
AThe selector name is invalid
BThe component lacks OnPush change detection strategy
CThe template should use a property instead of a method
DThe method currentTime() is called on every change detection cycle causing unnecessary recalculations
Step-by-Step Solution
Solution:
  1. Step 1: Analyze method usage in template

    Calling a method in template triggers it every change detection cycle.
  2. Step 2: Understand impact

    This causes performance overhead due to repeated method execution.
  3. Final Answer:

    The method currentTime() is called on every change detection cycle causing unnecessary recalculations -> Option D
  4. Quick Check:

    Methods in templates run repeatedly, hurting performance [OK]
Quick Trick: Avoid calling methods directly in templates [OK]
Common Mistakes:
  • Assuming selector name affects performance
  • Thinking OnPush strategy alone fixes this issue
  • Not recognizing method calls trigger recalculations

Want More Practice?

15+ quiz questions · All difficulty levels · Free

Free Signup - Practice All Questions
More Angular Quizzes