React is holding me hostage • Hacker News Board

Re: React is holding me hostage

#551

Post by brnewd » Wed, Mar 15, 2023, 1:26 PM UTC

KronisLV wrote: post #419

brnewd wrote: post #194

Earlier quoted context omitted.

TSX + MobX are the reason I'm happy to stay on the React train after a transition from AngularJs (1) to Vue 2 to React.

You might also be interested in checking out Vue 3 (with the Composition API) and Pinia, it's a pretty nice setup that feels similarly nice to how working with MobX is and even supports TypeScript. Composition API: https://vuejs.org/guide/extras/composition-api-faq.html Pinia (state management store): https://pinia.vuejs.org/ TypeScript support: https://vuejs.org/guide/typescript/composition-api.html While I mostly s…

Thanks, I'm sure Vue 3 is a lot better than v2, but I deeply appreciate TSX for its refactoring and type checking capabilities. Vue does support TSX but it isn't a first class citizen.

Re: React is holding me hostage

#552

Post by MrPatan » Wed, Mar 15, 2023, 11:35 PM UTC

yathaid wrote: post #550

MrPatan wrote: post #548

Earlier quoted context omitted.

Sure: - Click the link to show top scorers - Initiate fetching the data - (The view may change to indicate you're loading the top scorers, if you want, that's a different matter). - Receive the data, the view changes to display the data This is opposed to: - Click the link to show top scorers - View changes to show top scorers component. A component loads, or mounts, or inits, or does something which triggers a data…

Okay, I get the idea. How are you solving these issues: - how is the data fetch completion signalled to the component? - how is the data piped into the component? Would be happy to be pointed to some example code if you have.

> - how is the data fetch completion signalled to the component? > - how is the data piped into the component?

Both have the same answer. When you fetch the data you put it in the state, and then you render your components based only on that state.

If we're talking React the state makes it into the component through the props (pure UI component) or, if using Redux or similar, some kind of hook that triggers a rerender when the store changes (useSelector? My React-Redux is a bit rusty).

The point is not to worry anymore about change detection and rendering, because the framework takes care of it by being either fast enough that it can run on every change, or smart enough that it can tell when it's not necessary to re-render (caching, change detection).

Of course, this setup with redux etc makes a lot of sense for bigger apps with lots of state coming from different sources. I don't have any specific example I can point to, but any redux implementation examples could help. I use NgRx with Angular, and the docs are OK at explaining the flow of data.

Re: React is holding me hostage

#553

Post by yathaid » Thu, Mar 16, 2023, 5:56 AM UTC

MrPatan wrote: post #552

yathaid wrote: post #550

Earlier quoted context omitted.

Okay, I get the idea. How are you solving these issues: - how is the data fetch completion signalled to the component? - how is the data piped into the component? Would be happy to be pointed to some example code if you have.

> - how is the data fetch completion signalled to the component? > - how is the data piped into the component? Both have the same answer. When you fetch the data you put it in the state, and then you render your components based only on that state. If we're talking React the state makes it into the component through the props (pure UI component) or, if using Redux or similar, some kind of hook that triggers a rerende…

Thanks, this was useful.