Angular OnPush Change Detection Strategy: An Illustrated Guide

<p>Ah, change detection &mdash; the &ldquo;magic&rdquo; that makes Angular applications&nbsp;<a href="https://github.com/angular/angular/blob/main/packages/core/src/application_ref.ts#L1041" rel="noopener ugc nofollow" target="_blank">tick</a>, literally.</p> <p>For those unfamiliar with the term, it is the process through which Angular detects changes. (duh)</p> <p>You know&hellip; checking to see whether the application state has changed, and if any DOM needs to be updated.</p> <p>There are two ways this can happen, which are called strategies:</p> <ul> <li>the&nbsp;<code>Default</code>&nbsp;strategy, and</li> <li>the&nbsp;<code>OnPush</code>&nbsp;strategy.</li> </ul> <p>In this article, we will study the two change detection strategies of Angular. We will use illustrations to explain how these two work. By the end of this article, you will know how the&nbsp;<code>OnPush</code>&nbsp;strategy works in many different scenarios.</p> <p>Let&rsquo;s get started!</p> <p><a href="https://medium.com/angular-gems/angular-on-push-change-detection-strategy-bef4af0727b3">Website</a></p>