Optimization of Change Detection in Angular: Resolving zone pollution
#angular #ngZone
✅ Link: https://blog.suniltechtips.com/optimization-of-change-detection-in-angular-resolving-zone-pollution-6f9d0029fabb
#angular #ngZone
✅ Link: https://blog.suniltechtips.com/optimization-of-change-detection-in-angular-resolving-zone-pollution-6f9d0029fabb
#angular #NgZone
✅ Link: https://javascript.plainenglish.io/performance-optimization-can-we-configure-zone-js-to-ignore-specific-events-or-blacklist-them-8dadf10b3e8e
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
📄 RunOutsideAngular decorator
#angular #decorator #ngZone
✅ Article Link: https://emilgadzaev.medium.com/achive-better-angular-application-using-typescript-decorators-9e0eb01ad72d
#angular #decorator #ngZone
✅ Article Link: https://emilgadzaev.medium.com/achive-better-angular-application-using-typescript-decorators-9e0eb01ad72d
👍1
📄 Microtask Queue + RxJS + Angular: How it works
#angular #ngZone #microTask #macroTask
In the context of Angular, the framework doesn’t directly use the root zone. Instead, Angular creates its specialized zone by forking the root zone.
This forked zone, known as NgZone or sometimes referred to as the "inner zone," is augmented with Angular-specific behaviors. It's within this NgZone that Angular tracks changes and decides when to run its change detection.
The ability to fork zones and create this hierarchical structure is powerful. It allows for modular and layered tracking of asynchronous operations.
For instance, while the root zone might provide basic tracking, child zones (like NgZone) can introduce application-specific behaviors without affecting the broader tracking mechanisms.
In Angular’s case, the NgZone ensures that the framework can efficiently track changes and update the UI, building upon the foundational capabilities of the root zone.
✅ Article link: https://itnext.io/microtask-queue-rxjs-angular-ac3d8612d3f6
#angular #ngZone #microTask #macroTask
In the context of Angular, the framework doesn’t directly use the root zone. Instead, Angular creates its specialized zone by forking the root zone.
This forked zone, known as NgZone or sometimes referred to as the "inner zone," is augmented with Angular-specific behaviors. It's within this NgZone that Angular tracks changes and decides when to run its change detection.
The ability to fork zones and create this hierarchical structure is powerful. It allows for modular and layered tracking of asynchronous operations.
For instance, while the root zone might provide basic tracking, child zones (like NgZone) can introduce application-specific behaviors without affecting the broader tracking mechanisms.
In Angular’s case, the NgZone ensures that the framework can efficiently track changes and update the UI, building upon the foundational capabilities of the root zone.
✅ Article link: https://itnext.io/microtask-queue-rxjs-angular-ac3d8612d3f6
#angular #ngZone #zoneless
Why Zoneless?
Well, isn't it clear after those pictures? …In my opinion it might look clear, but this isn't the only advantage, there are others:
— Better performance: ZoneJS uses async task as indicators for change. It doesn't directly know when and where exactly the change has happened. You can imagine that it is a system that always runs and is checking everything, everywhere with some exceptions such as OnPush strategy etc.
— Debugging: We all know the Expression Changed After Checked we've all been there. Now the stack trace and errors will be more straight forward.
— Better feeling from the app: I haven't found the right words, but it just feel better. It feel better that when you change a property with async/await or using .signal(). Then the change appears immediately in the correct spot.
— Zone.js was the reason not to develop an App in Angular: Imagine you were building a snippet that was checking user interaction. For example you wanted to calculate how many times is user performing some event such as clicking, touching or interacting with keyboard -> in such scenario your app would go crazy with Angular and you would have to have a lot of components running out of Zone and manually trigger change detection. Otherwise your app even with OnPush strategy could freeze.
✅ Article link
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1