Observer pattern, examples, libs, alternatives?

I am only getting into purescript land and it seems very promising. I have been working with a lot of react and SPA in my previous projects. I used MobX, Redux, for state management ( I like MobX more).
However since I discover JAMstack approach, I am trying to get away from react where it is possible. Most of my use cases don’t require benefits of react and keeping html boilerplate and css in their spheres feels so nice. I started to play with recreating vanila js calls to dom to do my manipulation. Everything is nice but I feel that when the global state/ or project grows I am going to lost track of updating certain components and calling everything to render. This sounds a lot like observer pattern fit. So my question is, is there pattern / library you use to manage state with ? I noticed there is observer in WEB.DOM but that one is for lazy loading images etc. Not what I need.

I found this repo which could seems to fit to my use case but is long forgotten. and last time there was movement is 4 years ago.

There is rxjs which is also 2 version behind and feels like big overkill, if I am going to use only observer from it. I could be wrong, so please correct me.

MobX convert is crazy idea for me. Maybe something really simple with FFI. ?

So my question is: What kind of library do you use for this use case ? or alternative.

I don’t want to do anything with react if possible, so please alternatives.

Also if you know any micro package for throttle | debounce. I don’t need anything more.

Note: I am planning to use Aff wonderful package for most of my code.
or Should I just implement my own observer pattern ?

When I am thinking about it, isn’t this use case for lenses as well ?

Not sure if it’s exactly what you’re looking for, but perhaps Aff.Bus could help you?

1 Like

Looks really interesting, I am going to try and report back. :)) Also if you have any examples of using this, they are always welcome. Otherwise types will do :))

I’m also a beginner in purescript, so please take what I say with a grain of salt. :smiley:
I learned about Aff.Bus from Real World Halogen.

These files in particular:


I have finally tested the Aff.Bus library, and it does exactly what I want. :))) I am really happy that I found a way.

What really sucks is that there is no examples in the Aff.Bus package. So it took me couple of hours to figure out how it works.

For somebody out there: You need to use Aff fibre to be able to fork anything. And when it is written that read function blocks, it really blocks.

It will not work if you don’t create “promise” fiber, because you would block the rest of the execution. Now it feels obvious, but when trying it for first time, it wasn’t clear to me.

For reference, here is my dummy example which is hooked to click event. and console log on click.

2 events are fired based on this action.

Should I make pull request with some good example of using this package ??


Before you used this and learned more about it, how well did you understand Aff in the first place?

Well, I as you can see code, is really messy. I started to look into what parts I will need and async part is no brainer. I tried most functionality of Aff, week ago for first time, and there were some gothas, or “aha” moments, how it executes, or caches the “future promise aka Aff fibre”. So, I would say I knew how to use Aff library alone, but not in conjunction with others yet.

I had some issues, lifting things to Aff land. My biggest issue was how would I go, back to Eff, for function which accepts Eff instead of Aff. I was thinking of lifting that function but I can lift returning type, not input type. So I though I is just not possible, to go back to Eff(which would make sense) and I just lifted the whole function composition later when I used Eff.

I think the biggest issue I had, was I understood that I have to call it in Aff userland. But I just lifted the whole Eff land to Aff with launchAff_ $ liftEffect do and I was expecting it to work. Which doesn’t make sense now, and I would never do it now. But it took some time to figure out why it doesn’t work.

Also the confusion, that function was called only once. That maybe I just need to make infinite loop out of it. But then it still blocks down in the main function. So I just created Fibre and called them at the end of the main function.

To answer your question, I am a noob, but I have been learning about purescript for long time. I only started to actually use it now. So yes, I knew the Aff api, but I used it once.

1 Like