concept change detection in category angular

This is an excerpt from Manning's book Angular in Action. Login to get full access to this book.

If we go back to how the component trees are designed, you'll remember how the tree pushes data down to children and events bubble data up. Change detection is the mechanism that allows components to be updated when data changes in a parent component, and ensure views and data are in sync.

I can say with almost 100% certainty that no component will use every single capability, because it would most likely not function. However, mastery of these additional concepts will help you write more complex and dynamic applications. Let’s start by taking a look at change detection and how to optimize performance.

Figure 5.1 illustrates the two types of change detection. Imagine there’s a component tree with two properties, and the property 'b' is changed by some user input. The default mode will update the value in the component and then check all components underneath it for changes. The OnPush mode only checks child components that have an input binding specifically for the changed property and skips checking the other components.

Figure 5.1 Change detection starts at the top and goes down the tree by default, or with OnPush only goes down the tree with changed inputs.

I recommend spending time reading about change detection in more detail from one of the people who helped create it, Victor Savkin: https://vsavkin.com/change-detection-in-angular-2-4f216b855d4c.