Angular 18 Features: A Game-Changing Evolution
ฝัง
- เผยแพร่เมื่อ 7 ส.ค. 2024
- ► 🔥 Get my Advanced Courses Here ➡️ monsterlessons-academy.com/co...
Discover the exciting new features in Angular 18 with a deep dive into zoneless Angular applications! In this video, we explore how to configure a zoneless Angular app, the benefits it brings, and the changes it introduces. Learn step-by-step instructions to set up your Angular project without relying on Zone.js and understand how this impacts performance and debugging. Don't miss out on the future of Angular development!
This video is NOT sponsored. Some product links are affiliate links which means if you buy something I'll receive a small commission.
LOOKING FOR THE VIDEO EDITOR? ➡️ ekaterina.kochergina.business@gmail.com
SERVICES THAT I'M USING
Backblaze unlimited cloud backup ➡️ www.backblaze.com/cloud-backu...
TIMESTAMPS
0:00 Introduction
0:16 What's new
2:12 Try it on example
MOST POPULAR COURSES
► Javascript interview questions ➡️ monsterlessons-academy.com/co...
► Typescript interview questions ➡️ monsterlessons-academy.com/co...
► React interview questions ➡️ monsterlessons-academy.com/co...
► Angular Interview Questions ➡️ monsterlessons-academy.com/co...
► Angular Testing ➡️ monsterlessons-academy.com/co...
► React Testing ➡️ monsterlessons-academy.com/co...
► Building real project with Angular + NgRx ➡️ monsterlessons-academy.com/co...
► Building real NestJS API ➡️ monsterlessons-academy.com/co...
► Building real fullstack project ➡️ monsterlessons-academy.com/co...
CONNECT WITH ME!
► TWITTER - / monster_lessons
► INSTAGRAM - / monsterlessonsacademy
► TIKTOK - / monsterlessonsacademy
REFERENCES
► Source code - github.com/monsterlessonsacad...
WATCH NEXT: Learn Angular Signals - The Future of State Management - th-cam.com/video/RLoACfLYwPs/w-d-xo.htmlsi=kGZcBo3bC77t28gA
A key point here, markForCheck method previously didn't trigger change detection it only marks the components as dirty from the current component up to the root parent... but now in Angular 18 besides doing that it also triggers change detection as well...
Thats why with signals as well as the Async pipe which call the markForCheck methods are still working properly...
No, markForCheck does the same as before. It marks comp as dirty. It doesn't trigger change detection.
Before we used the async pipe, so it would call the markForCheck method, and with signals, we just have to normally call them. Angular now will register an effect (consumer) that will listen to this signal and mark the template for check every time the signal changes.
I prepare a big video about change detection. Stay tuned.
@@MonsterlessonsAcademy marking a view dirty does scheduling detection in v18 because of the hybrid CD. The only case where it won't is when opting out of hybrid CD with provideZoneChangeDetection({ ignoreChangesOutsideZone: true }),
Since im using signals everywhere i can, I'm cool 😎
Thanks for the video
Yes you are!
Am ready to go zoneless. Need to check if 3rd party components need zonejs. Excellent video thank u!
Good luck!
We already moved to zoneless, it's amazing
Yeap!
maybe its not the async pipe which is triggering the CD, I think its the interval() of the rxjs, it has cd.detectChanges() in it.
No it's not. Async pipe specifically is wrapped in mark for check. I will release a video about how change detection workes in Angular soon. Stay tuned.
Do you think Zone.js will be removed in the next version? I always try to keep my teams up to date with new features in their projects, but this time it will be very challenging if we want to switch all our components to OnPush(15 projects in active development). By the way, we haven't had any performance issues, so why is there so much fuss about Zone.js?
I don't know when Zone.js will be removed. As I said Zone.js or Zoneless don't bring performance benefits. Just smaller bundle size and 1 less dependency for the framework itself.
onPush brings huge performance benefits. Obviously if you projects relatively simple regarding rendering you might not feel like you need that (but lots of companies forces onPush to all comps by Eslint by default).
Zone.Js won't be going anywhere in the foreseeable future. Too many apps rely on it and it is almost impossible to provide automatic migrations to zoneless.
18? wasn't 17 realeased not that long ago ? But thanks for the great Video on it.
It was released at November 8, 2023. Half of the year ago. Time is flying :)
Every 6 months
Angular releases a major version every 6 month. Mai & November usually.
Can you stop breaking everything, at Google maybe you have one or more developers maintaining an application, in the real world one developer is maintaining 15+ applications!!!!!!!
But nobody forces you to update if you don't need to. I understand the point of backwads compatibility as well as improving performance with signals, zoneless. Angular 18 doesn't have any breaking changes. I don't see the problem.
@@MonsterlessonsAcademy of course you don't lol.
Most third class framework...
No proper documentation, just colorful website. Not given any examples of particular concept, just definition with colorful borders.
Matured people will always use React or Vue
Matured people pick jobs which pay good money and don't care about technologies.
@@MonsterlessonsAcademy This is true. But when it comes to developer experience which is the main job of ours, Angular is the worst. No proper documentation on Errors and very less information on APIs.
All the time developer has to figure out what is the usage of particular method. Angular team doesn't mentions it. Really disgusting to work with.
No offense but this is the reality.
+