Zaid-Ajaj / Feliz

A fresh retake of the React API in Fable and a collection of high-quality components to build React applications in F#, optimized for happiness
https://zaid-ajaj.github.io/Feliz/
MIT License
531 stars 77 forks source link

useElmish vs useReducer #578

Closed LuisFX closed 11 months ago

LuisFX commented 11 months ago

We currently use "useElmish" through our application. I recently discovered that Feliz has an implementation of React's useReducer. Implementing a simple counter example using "useReducer" seem very similar for simple situations. The differences that are obvious to me are:

Since there is no documentation in the Feliz docs website, I'm assuming that useElmish is the preferred method.

Are there other differences, benefits or caveats of using one over another with Feliz?

Also, is it advisable to mix them, or should I just keep my app using only useElmish?

MangelMaxime commented 11 months ago

useReducer is a native React feature which probably explains the lack of documentation around it. https://react.dev/reference/react/useReducer

useReducer and useElmish kind of overlap in term of scope but the main difference is that useElmish should allow to use libraries from Elmish ecosystem like debouncer, etc. Plus as you noted the benefit of generated messages to handle complex.

useReducer was introduced by the React team, to kind of include Redux in React directly without having to install an external dependency. I am not sure if this succeeded in archiving the goal they had in mind.

You can mix them, in your application but I think for consistency it is probably better to stick with one.

LuisFX commented 11 months ago

Hi @MangelMaxime! Thanks for the insight.

Yes, I understand that useReducer is part of the React api, and also that it was a way to bundle a redux-like solution into React to manage complex state.... this is the reason I'm interested to know if is there is a place for useReducer within our app for simple situations where useState is not sufficient to manage state (because of deeply nested components) BUT useElmish might* be overkill for adding a "simple" state machine into a component. Basically, is useReducer recommended at all* within a Feliz app? (or was it only added just for better coverage of the React API?).

After all, the Elmish lib it's tiny, and already loaded in our app.

(** I say might, because useElmish is simple enough to implement! )

Thanks again! Cheers.

MangelMaxime commented 11 months ago

Because useElmish is already used in the application, I would stick with useElmish for consistency and because in the future if the component needs to evolve it will avoid a re-write/translation from one system to another.

LuisFX commented 11 months ago

Got it! Thanks much... sitcking to useElmish!