2.2 KiB
Mastering Change Detection cycle with a scroll example
Author: Thomas Laforge
Information
In this challenge, you will need to optimize the change detection cycles run by Angular.
Zone.js will trigger a change detection cycle each time a scroll event is dispatched. However we only want to show or hide a button at a specific scroll position. Therefore, we only want to refresh our application once.
You can vizualise how many times CD is triggered by installing the Angular chrome devTool and starting a new recording on the profiler tab.
The following video will explain what is the goal of this challenge.
Statement
Your goal for this challenge is to avoid all those unnecessary change detection cycle and trigger a CD only when needed.
Constraint:
You cannot opt-out of zone.js. If this code is part of a large project and you opt out of zone.js, you will break many things within your application.
Submitting your work
- Fork the project
- clone it
- npm install
- nx serve scroll-cd
- ...work on it
- Commit your work
- Submit a PR with a title beginning with Answer:12 that I will review and other dev can review.
You can ask any question on 