I was trying the @defer decorator to lazy load a specific component called app-box-five . Below is a screenshot of my code: enter image description here @defer (on timer(5s)) { }
After waiting 5 seconds, I checked the network tab in the browser and noticed that app.component.ts was lazy-loaded instead of box-five.component.ts.
I expected that only box-five.component.ts would be lazy-loaded, as shown in the screenshot:
please could you explain why this behavior happened ?
On your screen you're highlighting the initiator of the chunk download (so the parent component).
Check the content of the chunk itself, and you'll see that yout component box-five is correctly lazy-loaded.