ActionCable->Stimulus: Dispatch received message to controller

[Younes Serraj]

Hi,

I managed to send a message from a Stimulus controller to ActionCable, but I'm wondering how you would handle the reception part?

Ideally I'd like the ActionCable javascript `received` function to somehow pass the received message to my stimulus controller(s) and let them do their thing (update targets, etc.).

Is that a good or a bad architecture? Does that even work when there are multiple instances of the same Stimulus controller within the same page?

TL;DR: how do you advise to update the DOM in a clean way when you receive a message with ActionCable?

[San Ji]

Hi,
I did not use Stimulus so it may sound like trolling, but it is very real and doable.

For me it is not about Stimulus; when you are talking about software architecture, I know a thing or two.

If your business logic is coupled with Stimulus (i.e. you are mentioning any name from Stimulus package in your business logic), you need to rewrite everything when you break up with Stimulus. And libraries like Stimulus do change, and they change very rapidly, any solution that couple the business logic with Stimulus is not good enough.

Next year your developers will demand using other tools and frameworks. Looking back a few year and you will notice the same thing happens all the time.

These libraries should be used as a plugins. It should be feel like rewriting the firmware when you migrate away from a library, not rewriting the whole thing.

Some libraries are just not possible to be integrated in this manner.
For example, Angular came up with the whole compiler and their own flavor of typescript, this is too invasive, there is no way to use Angular as a plugin. If we want to switch out Angular with something else, there is a good chance that we have to rewrite everything; not a single line of code will survive the transition.

Going into your specific questions.
How to update the DOM in a clean way with a massage from ActionCable?
Any way that not mention anything about ActionCable in the DOM updating module.
They are different, separated functionalities, should be handled separately.

Likewise, don't mentioning anything about ActionCable in a Stimulus class; or your code in Stimulus will be coupled with the ActionCable. I believe you can simply use typescript interface to glue the module together.

For me I have seen enough. And I choose jquery to update the DOM most of the time. (with React in some of them just to leverage on the community)
Bad things people are talking about jquery is just to make them feel better about themselves, in reality their architecture is flaws.

I did not answer your specific question about Stimulus because I can't, but hope this helps.