Fixing Arrays In React Dependency Arrays

How to include arrays, functions, or objects in your dependency arrays safely.

#shorts

[mukhammadsobirov]

You Sir is the hero we don't deserve!

[pim]

Wow this shorts are even better than the videos!! Keep up the great work! This is so helpful.

[humansvibrations]

Best channel for learning advanced react tutorial..

[SanjuKumar-hkyy]

I am currently working on E-commerce project where Many times this type of porblem has come so now I can fix them by using these solution. thank you very much ☺️☺️

[Billiam]

As an Angular dev by day, trying to pivot towards React/NextJs, these are fantastic Jack. Please keep em coming! If you take any requests, a short (or perhaps a full video) about React query, would be really useful for me. 👌

[SamyarBorder]

This is an awesome short, I had this question for a while

[dalebradleygordon]

Great video as always Jack!

This is why I hope frameworks like Solid gain more traction and start to garner broader industry adoption.

The concept of having to handle references and dependencies for side effects in a component is due to an outdated abstraction in the Vdom.

I think a compiled, single run approach like Svelte and Solid is a lot more intuitive and beginner friendly and make it easier for all skill levels to write performant applications 🙂

[sevilaytemiz]

Thank you, your videos help me a lot.

[gmssoberyahsharahla]

Great video. This was needed. Non-primitives in a dependency array causes lots of problems for devs.

[moodynoob]

Although I greatly enjoy React, managing references is a particular DX pain point that frustrates me. Sometimes I have to write more code than I have to satisfy the linter, and I also worry about co-workers who don't understand why I'm using so many refs in my code.

[leotravel]

I created a custom memoize fn with shallow equality comparison for arrays. And I also use a constant emptyArr that I import every time I have to use an empty array (eg initializes and default values)

[betoharres]

Ive seen tech influencers suggesting to make it “simple” and de-structure useEffects and having variables being declared in the middle of the component

[Zagoorland]

Jack, you should set better safe area (padding) in youtube shorts, for subtitles :)

[ahmedsaboor]

Thank you for your content, but how about arrays or objects coming from global data context created using create Context of react?

[StPQW]

Thanks so much for your videos!

Could you please explain why "arrays defined by useState or useReducer are awesome"?
I'm working on a todo list that has the todos as a state variable and some functions for edit, delete, etc.
To my understanding, if any of the functions trigger and change the todos (with setTodos), the entire component re-renders -> creating a new todos object.
I'f I'd use useCallback for the functions with the todos in the dependency array, won't React see the dep. array as changed and re-run the function inside the useCllaback?

[wagnermoreira]

If I pass an array to use memo deps array, will use memo compare it by value or reference?

[dazuk]

Can anyone recommend any good books for this kind of thing?

[LifeIsCrazyAsShit]

I have a problem for you which I did try but unable to do it can you please create a video on below problem,

I want to use hook (useReducer with reducer function and initiate state)

Initial state is a simple objects which comes are (backend) and it's dynamic

How to set the initial value with this data in our useReducer hook

When I try to do so it's not working

[botarvagyokszervusz]

About the refs in deps array, I thought ref changes were not picked up by useEffect and the other built-in hooks. Am I wrong here?

[DavidBeharL]

I want to share this through instagram, do you have an instagram account Jack?