What is @defer, and when would you use it?
Model answer
@defer delays loading part of a template and its dependencies until a condition is met, for example when it enters the viewport, on interaction, on idle time or on a timer. The content is split into a separate JavaScript chunk and loaded only then. You can add @placeholder, @loading and @error blocks for the states.
Use it for heavy components below the fold, charts or editors, to improve the first load. Do not defer content visible at first paint, and always test that the placeholder does not cause layout shift.
Learn this topic
Angular Tutorial: Beginner to Advanced .
Sign in to add your own answer.
More questions
- What are the parts of a component?
- What is data binding? Explain the four types.
- What is the difference between interpolation and property binding?
- How do you pass data from a parent component to a child component?
- How does a child component send data to its parent?
- What is the component lifecycle? Describe the main hooks.