I tried to build my dream (simple) state management for Angular

We've talked a lot about this idea of using RxJS and Signals for state management, where RxJS handles data sources and events and Signals handles representing the state.

To make this process and easier and more declarative I've been working with Chau Tran to develop a utility called signalSlice.

Example implementations of signalSlice:

0:00 Introduction
1:35 Signal Slice
1:54 Creating state
2:09 Selectors
2:24 Sources
2:56 Action Sources
3:49 More declarative?

#angular #rxjs #signals

[JoshuaMorony]

And another big thanks to Alexander Castillo for sending through the first public PR for signalSlice!

[asyncpipe]

One day we will find the holy grail of state management

[kubanm]

This looks really good. And ease of creating component/feature/global state it can give is tempting.

[balintcsaszar]

1. the concept is really close to ngrx (signalSlice = reducer, there actions and selectors, I assume ngrx effects can be cloned too, then it is the same with different solution)
2. for me it is a bit too nested, which means, could be less readable
3. Idk the future but currently signals are heavier structures than observables => performance measurements would be interesting
4. thanks for the video 👍interesting

[AaAndz]

Very interesting! I'll definitely use it

[Jaytonic]

nicet to see :). Side note: I know it's trendy, but I'm not a big fan of those put everything in the parameters of one method. I personally like better to have one class that would inherits stuff. This looks too much like react garbage where people don't know how to do OOP.

I like the sources approach though :)

[chaos_monster]

I struggle to see the benefit of this over the usage of a service with methods for actions and usage of (the most neat and handy addition of) connect

[omergronich]

This is dope! Very similar to Mike Pearson's state adapt. Will definitely give it a try!!

[quattroUnodos]

1. Anyone incorporate NGRX component-store with signal components?

2. Comparing NGRX Component-store to the solution in this video: component-store already has all the functionality shown in this example plus the elaborated on extension of signal slicing using the built in selectors.

3. Regarding SRP-ish concerns: we use component-store to separate out a lot of this logic from the component and our components rarely do anything except map a view model observable to the template and map template interactions to methods of the component store. Sometimes the component will have basic UI related code, but they are almost completely divorced from service interactions.

4. Is removal of state and system interactions from the component itself, pushing it into component-store (which is very similar to a behavior subject service) a natural step or does it introduce unneeded complexity?

[jhadesdev]

Thank you for sharing, but I cannot see how I could realistically train my team to understand this or even maintain code written in this way. Why not just use Signals instead of RxJs for the vast majority of use cases, and use RxJs only when and if we really need to? I don't know if you heard but the Angular team has announced that they will make RxJs optional in future releases.

[dangerfox]

Is the simplicity in creation worth the loss of redux dev tools within NGRX? I find seeing live state, and actions while creating and debugging complex applications invaluble.

[botyironcastle]

wouldn't it be better to use custom events and listen them as a reducer instead of observables and sub?

[rohitkharche]

Can you please cover analogjs and give your thoughts about it ?

[craigritchie]

A lot of this is making sense to me but I’m having trouble figuring out where to put calls to a Toast service to let the user know an update was successful. Or say after editing and saving an entity I want to change the title in the tab to reflect the entity name change. Where do these things go? Right now I’m placing the code in my subscribes, for example, the save$ Subject action.

[trevormontgomery]

Will the course be updated with your new state management technique shown in this video

[Augustinasas]

I mean I really like this as an experiment to deepen my knowledge about redux pattern but is there something fundamentally wrong with NgRx? I feel more like using well established library that has tons of tutorials to pass for my dev team, than to use a new implementation of redux pattern without hearing what the NgRx (or NgXS, akita) was lacking. I fail to understand where using this library would be beneficial instead of using traditional redux libraries. Are there specific use cases?

[RobertMulderNL]

What do I do when I have an action that posts an update to the server for an item in the state, but between starting the action and completing the update I want to set a loading = true on the item being sent.

As far as I can tell you can't update the state in the middle of the action stream(to set the loading flag), only using the resulting item in the action stream

[Maxzilla]

I'm still not fully convinced the sources need to be Subjects?
Couldn't you just provide and call a method instead of "next'ing" a Subject property? 🤔

So it'd be "checkListService.add(...)" instead of

[StephenMoreira]

Personally, I'm okay with the imperative portions.

[tolstoievski]

is takeUntilDestroyed really necessary for http requests ?