react-rails icon indicating copy to clipboard operation
react-rails copied to clipboard

Question: React-Rails, MutationObserver, and ERB

Open ccachor opened this issue 6 years ago • 1 comments

I have a question that borrows some ideas from Stimulus (https://github.com/stimulusjs/stimulus). From what I understand, Stimulus uses data attributes to represent state, similar to how you can pass props to the react_component view helper.

I have an older app that we're introducing some React components to where it makes sense, and I'm trying to figure out a way to re-render props from an ERB file. I saw that Stimulus makes heavy use of the MutationObserver API, and I was wondering if anyone has used a similar pattern to re-render application state without reloading the page? I'm thinking along the lines of react_component generates a unique ID that is transmitted along with an AJAX request, when the ERB file runs, it updates that component's react-props attribute and the component is re-rendered through forceUpdate() or something. The MutationObserver API is used to detect that the data-react-props attribute was changed and trigger the component to update w/fresh props.

Hopefully this makes sense!

ccachor avatar Sep 01 '18 02:09 ccachor

It sounds quite cool, I'd be interested in seeing a proof of concept. Is this something you feel that you could contribute?

Not sure what the advantage would be over HMR and live-reloading the page in development once we get HMR working but always interested in seeing new ideas.

BookOfGreg avatar Sep 03 '18 08:09 BookOfGreg

@ccachor @BookOfGreg We have had no updates on this since 2018. Let's close this. If we have a POC, we can create a new issue.

alkesh26 avatar Nov 03 '22 09:11 alkesh26