Change detection: events, zones, OnPush, signals

Why did that render?

Angular keeps the DOM in sync with your model through change detection: after any asynchronous event (click, HTTP response, timer), Angular walks the component tree and checks bindings against the model. Default strategy checks everything; OnPush restricts checks to subtrees whose inputs changed by reference or whose events originated within them; signals make the dependency graph explicit for fine-grained updates.

Three strategies, one question

• Default — safe, simple, pays at large trees.
• OnPush — opt in per component; use immutable inputs and async pipes.
• Signals — signal() holds state, computed() tracks dependencies, the template reads minimal updates.

Open interactive lab →