# How Angular Updates the DOM — Angular

Source: https://www.geekswithgeeks.com/en/angular/ng-change-detection

> The basics of change detection, and the OnPush strategy.

## The default pass

By default, after events like clicks, timers, or HTTP responses, Angular walks the component tree and re-checks each template for changed values, updating the DOM where needed.

## OnPush strategy

`OnPush` tells Angular to skip a component's subtree unless its `@Input()`s change by reference (or a signal it reads changes) — a common performance win.

```typescript
@Component({
  selector: 'app-price-tag',
  standalone: true,
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `<span>{{ price() }}</span>`,
})
export class PriceTagComponent {
  price = input.required<number>();
}
```

## Signals play well with OnPush

Because signals track their own readers precisely, components built around them naturally work well with `OnPush` — you get the performance benefit almost for free.
