Відео

Thanks

Thanks for the content Adding few of my leaning below 1. The use of `debounceTime()`, `delay()`, or any other time-related operators can hinder performance, especially when there are many subscribers. 2. Late subscription to Subjects can be a challenging issue for beginners to identify and debug. 3. `TakeWhile` will unsubscribe from the stream when the specified condition is met.

Great video. However, in step 3 you suggest we use a signal but I still don't see what you gain from that. It's just more code.

thank you

Why overcomplicate this basic filtering, when users can have a button and after btn click you call rxjx for filtering. This situation are no benefit for nobody, the user does not need real time filtering, he needs just filtering to work and to have correct results. Angular made things more difficult with this kind of examples they promoted with rxjs library

Nobody in youtube teaches angular like this depth as you! Thank you very much and keep teaching us such valuable concepts.

Perfect explanation of something that is really needed for angular developers around the globe. Saw those mistakes everywhere. You rock, really.

much needed, thanks!

Great video ❤

nice to mention that rxjs eslint rules are exist to prevent these mistakes 👍 and yes I know....I saw many project without proper eslint rule set, it is sad

I see the nested observables is asked alot in interviews 😅. How the toSignal works here does it subscribes to observable and return new signal and unsubscribe on component destruction or does it create new signal on new emission, how does these things play out?

For an RxJS expert, this is basic knowledge. For an RxJS beginner, it is damn complicated😅

This is the best way to the show impact of rxjs mistakes and best practices: show code and results in dev tools

I think that performing side-effects without subscription (like in the last example) is anti-pattern. What if someone will refactor this code and will remove the read of `searchConfig$` in the template? your localStorage will not be updated anymore. For that case I will use `shareReplay` and will use it in both cases. One more note: once you are using `shareReplay`, you are doing a subscription behind the scenes, and you should add `takeUntil` or unsubscribe from it manually. And I love your content BTW! I learn a lot from it!

Mistake 4. Won't shareReplay(1) keep the subscription active even after component is destroyed? Afair it will. In this case we can use refCount or takeUntilDestroyed BEFORE shareReplay(1).

Thanks man, you are true genius🔥

My top biggest mistake with rxjs in angular context for a long time was using it at places where it wasn't needed and not using it where it was.

That was indeed a compendium of mistakes out in the wild, good job, Dima!) Regarding warming up observables, would you suggest using `shareReplay` or rather `share` with explicit configuration (connector, resetOn..., etc) to avoid misabiguity?

What Happens with CatchError inside the pipeline? Should I use takeUntilDestroyed before the CatchError or after?

this.parentFormGroup.addControl causes to form.pristane = false and cause the error: NG0100: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value for 'ng-pristine': 'true'. Current value: 'false' how can i fix that ?

Very good video! I learned a lot, your explanations are just clear and consise, thank so much for this content. Can you please make a video about i18n specially using @angular/localize, I haven't found a clear guide for the complete workflow (develop->extract->translate->merge) and loop again. How looks like this in an large/enterprise basecode, even the official docs are weak in this topic, how do Google use this in production, I will apreciate so much

A very interesting and usefule video! Some of these mistakes I'd made before and my coworkers explained me them. But now I have more systematic and deep understanding of all these bad patterns, so thank you so much:)

Awesome 👏👏

Among the professionals I've interacted with, very few are willing to proactively learn Angular, let alone RxJS. They always say they've 'heard' it's difficult. From my experience with Angular, Vue, and React, I can genuinely say that I love Angular. I believe it's a rare gem, along with RxJS. I even try to use TS + RxJS for backend development whenever possible.

3:05 hey i have question , suppose there is a button , get data upon invoking these method we will call the rest api ! and get the data , here i am not waiting for the component to be destroyed , as soon as i got the response either sucess or anything i am unsubscribing the Subject, because it is no longer required , second time again new Subject will be created so if i am unsubscribing onDestroyed then i felt it is wrong , what if use clicked 10 times ! and we are holding the Subscription each time the Subscription will ovveride by new Subscriber , and in the end we are unsubscribing last Subscription , and remaining 9 will still bein the memory ! this is my research what your call on this !! ,

Good job. I knew most of the things you explained (also cause I've already watched the other videos you referenced here) but I still have a tricky question: does async pipe unsubscribe from EVERY subscription in the chain? in your example at 9:30 does async pipe unsubscribe also from the valueChanges of searchConfigForm? doesnt it have a limited "range of action" as the takeUnitlDestroyed() ? thank you : )

Grate vidio, thanks

Great content as always! Even experienced devs can learn something from these tips.

Should untilDestroyed(this) from the ngneat library also be used at the end of the pipe?

Should untilDestroyed(this) from the ngneat library also be used at the end of the pipe?

Thank you @Decoded Frontend i think i have all of them more or less in my code , time for fixing!

6 out of 6😁. lots of code update to do.

I have a question regarding the valueChanges of the form. Do I need to unsubscribe from it?

Injecting the DestroyRef just to avoid init the subscription logic inside OnInit instead of the Constructor... Typical Angular.. I am like "Brother Ugh... Brother Ugh..." 😂😂

Thanks for another great video!

Thank you. Of all those who talk about angular, your videos are the most useful and detailed. I like that you are not afraid to explain some things using source code, it gives a moore deep understanding of the principles of the framework. I have a request: could you consider the microfrontend and the role of angular in it? I think this is a very relevant and interesting topic. For example, it confuses me that in the case of Angular you have to use a custom webpack configuration because it doesn’t seem like the authors themselves approve of this, otherwise they would have added such a feature to Angular themselves.

My favorite coding content creator. Thanks, Dmytro!

probably im wrong, but sometimes see something like this: stream$.pipe( ...any logic ).subscribe(value => this.subj$.next(value)) so, guys in my team often use useless subjects and move values from observables to subjects please let me know, if my comment is correct, im newbie in angular and feedback will be useful for me

Nothing learned, still a great Video for beginner🎉

Thank you for sharing useful videos!

Thank you bro. Although I stoped coding in Angular two years ago, such content still useful. specially for a NestJS dev

Do you have any video which talks about Replaysubject() in RxJs ?

With shareReplay, once your observable becomes hot it will never unsubscribe. It is a common mistake I wish was mentionned in this video. To mitigate this you need refCount:true, but this will resubscribe to the inner observable once the refCount drops to zero and a new subscribption is made, causing the initial problem you are trying to solve. The real common mistake is to usage of share() and shareReplay() =) They might be nice for simple usecases but will cause headaches the moment you do anything more complexe. I used to use them often, now I avoid them like the plague.

Awesome video 👍

Great video! I hope you can share more tips like these. I think they can benefit the community a lot. Thanks!

Btw tap operator doesn't modify stream even if tap callback will accidentally return some value so +1 to safety side effects :D

People incorrectly thinking pipe -> switchMap cancels HTTP requests outside of a dedicated stream e.g. calling getUsers( ) twice

Amazing video. There's always something to learn!!!

not me writing a jotai clone using rxjs to avoid directly using rxjs directly, which supports observable composition, give it any two or more observables and provide a function that computes your derived observable, it handles all the headaches so you can just code instead of wondering is this hot, is this cold, did i unsubscribe, should i call this or that in the right order. why are we still dealing with raw rxjs at this point after it has been out for so long just like reduxToolkit takes the pain out of working with redux some already already made a rxjs lib that supporst composition. will probably edit this comment when i remember where i found it. anyone else thinking rxjs should have been simplified by now? like a library on top of rxjs that can catch these or provide simple constructs and pattern functions that should deal with most of these issues. rxjs has been around for far to be dealing with so many gotchas and edge cases.

Great video!