top | item 32588743

(no title)

amccloud | 3 years ago

Oh glad you responded. I'm happy to keep going for the sake of alignment and maybe we'll both find something out of this and the community will have more alignment.

> Route is state too. Loading data based on route is very common. There is no reason to avoid useEffect for triggering side effects based on state or props in components. It's the whole reason it exists... > Or do you only use libraries for loading data, without realizing they rely on useEffect, perhaps?

I've worked with many teams through this specific issue effectively inventing useEffect many times over before hooks. Loading a document or history change are exactly the types of interactions I was referring to in my comment. Absolutely handle this close to your routing/cache and you won't have to plumb stable objects to deep side-effects in your application.

> Your statements make that difficult.

Statements are hard to see if you don't have empathy for why folks are saying what they are saying it. From what I understand the author's points seems to revolve around their observation that react engineer's don't know things they should. While I certainly think that is true, in my experience I haven't professionally worked with any react engineers that aligned with any of the author's observation for sr/jr engineers.

I'm curious what your take is on the following:

> Some might also know useRef if they at some point tried to implement some DOM manipulation stuff (more often than not copied from SO) that probably should have been solved in CSS or otherwise. Most sr/jr people not familiar expect react to work like jquery or need an escape hatch to integrate with some non react lib that's expecting a mount point. In rare cases folks use refs for every element, like jquery, and just can't quite grasp react.

> useEffect and useState combo for processing some data without any side effects I've never seen this recommended and am not even sure what it means. Anything derived from useEffect is a side effect. I've seen this labeled "derived state" and folks often avoid it.

> One common pattern is the useEffect and useState combo for processing some data without any side effects, causing unnecessary render cycles between data change and computed value update. I've mostly seen useMemo/useRef/useSelectors used for this. I do agree with author that derived state should proxy to the underlying state and not copy it.

> useCallback and useMemo? Not so much. Everyone seems to know this. Jr and Sr folks use it all the time, even scenarios where they de-optimize

> Another is lying in the dependency arrays (and disabling that annoying lint rule) for various hooks since it was seemingly the only way to stop that useEffect from triggering the rate limiter of that API you were testing (we all do this from time to time, but removing the dependency is not the right solution). Never seen this. Maybe forget to add something to the array because they relied too much on react's linter doing this for them.

> Forget about "doing too much work", the primary reason useCallback and useMemo are your friends (and sometimes, useRef) is because they make those function, array and object references stable, and stable references work very well in dependency arrays. I've never experienced anyone using useCallback, useMemo, or useRef to prevent "doing too much work". Each one has been used for their specific use case with maybe useRef filling in for instance properties that don't trigger any effects.

The only other instance of these hooks i've seen is where useCallback and useMemo used is unnecessarily to keep objects stable in scenarios it didn't quite impact anything downstream. Another variation is where useCallback and useMemo are never stable as intended because the keys aren't stable to begin with. This distinction matters where sr engineers, yes sr, will easily accidentally do something that is effectively useCallback(handle, [Date.now()]).

> But why are these so unknown among so many that seemingly should know better? I guess most people don't really read the docs (breaking news). I'm pretty sure I've read every version of react's docs since launch and I guess i'm making the same mistakes. Also many of my team members who make constant mistakes with memoization are in the docs daily. I don't think everyone is missing the details you think they are.

discuss

order

No comments yet.