Questions tagged [react-usememo]
169 questions
70
votes
3 answers
Asynchronous calls with React.useMemo
Scenario is relatively simple: we have a long-running, on-demand calculation that occurs on a remote server. We want to memoize the result. Even though we are fetching asychronously from a remote resource, this isn't a side effect because we just…

Doug Denniston
- 894
- 1
- 8
- 12
25
votes
3 answers
What are production use cases for the useRef, useMemo, useCallback hooks?
Outside of the counter example seen in many YouTube tutorial videos, what are practical/real-world use cases for useMemo and useCallback?
Also, I've only seen an input focus example for the useRef hook.
Please share other use cases you've found for…

ln09nv2
- 965
- 4
- 19
- 35
24
votes
2 answers
React.useMemo in class component
Is there a way to use this hook or some its analogue of the React API in the case of a class component?
I'm wondering, should I use some third party memo helpers in the case of a class component (eg. lodash memo, memoizeOne, etc.) or there is exist…

Velidan
- 5,526
- 10
- 48
- 86
8
votes
2 answers
ref scrollIntoView does not work with behavior smooth on react
I am creating a component that will hold a dynamic list of elements and for styling reasons, I need to keep the title for each section in a sticky nav menu.
As the user scrolls up and down the list of sections I need to apply styling rules and also…

Gareth Townsend
- 119
- 2
- 8
8
votes
2 answers
The object passed as the value prop to the Context provider changes every render
I have this error:
src/index.js Line 9:36: The object passed as the value prop to the
Context provider (at line 9) changes every render. To fix this
consider wrapping it in a useMemo hook
react/jsx-no-constructed-context-values
I am not sure…

Alex Kuzmin
- 81
- 1
- 1
- 3
8
votes
1 answer
is it possible to use useMemo hook inside contitional statement?
I was trying to use react hooks inside conditional statement unfortunatly react gives you error for almost all the hooks and its intented as per hooks philosophy.
and then I tried useMemo hook inside else statement and it worked no errors.
I googled…

Sujan Thakare
- 882
- 1
- 10
- 27
6
votes
2 answers
useMemo hook not working with map elements
I am using useMemo hook to render map items.I added items parameter to useMemo hook, based on items change it will render. But changing loading state and items change, Item custom component rendering twice. Am i doing any mistake on using useMemo…

skyshine
- 2,767
- 7
- 44
- 84
6
votes
2 answers
How can I memoize a variable derived from redux useSelector?
How can I memoize my rawTranscript variable so it doesn't trigger the useEffect below which subsequently triggers the expensive transcriptParser function? I've been trying a lot of different approaches, but the fact that I am using a redux-hook…

kevin
- 2,707
- 4
- 26
- 58
5
votes
3 answers
Why use useMemo and not useCallback here?
So as i understand the difference between the two is that useCallback is used if a function or object or array is returned while useMemo when a primitive is returned.
But i was looking up debouncing (this is the article:…

H.b
- 239
- 2
- 13
4
votes
2 answers
Is good to use React.useMemo or React.useCallback inside component props?
I was thinking about how to code TailwindCSS cleaner in React. Since Tailwind is utility-first, it makes us inevitably end up with components (ex: className="w-full bg-red-500"). So, I tried to create a utility like this:
utils/tailwind.ts
const tw…

mnrendra
- 162
- 1
- 1
- 8
4
votes
0 answers
MUI - extending sx props to memorize value and avoid rerenders
The sx prop from MUI is useful for speed and code readability (in reason) but it can cause many unnecessary re-renders (and this compounds with the sx lesser performance).
So I was wandering if there was a way to add a useMemo wrapped version of the…

Clorofilla
- 415
- 2
- 6
4
votes
1 answer
Is it a good practice to use optional chaining inside reacts useMemo/useEffect dependencies?
I'm working on a large react app where performance matters.
At first I avoided using objects properties inside useMemo dependencies (I was avoiding dot notation inside dependencies). But I have seen this in react's documentation so I think it is…

gkpo
- 2,623
- 2
- 28
- 47
4
votes
1 answer
Best way to use useMemo/React.memo for an array of objects to prevent rerender after edit one of it?
I'm struggling with s performance issue with my React application.
For example, I have a list of cards which you can add a like like facebook.
Everything, all list is rerendering once one of the child is updated so here I'm trying to make use of…

gwrik09
- 121
- 1
- 2
- 9
4
votes
1 answer
How to memoize custom hooks to improve performance
Have below function which is common custom hook and called from multiple places.
How this can be memoized to improve performance. (While debug on browser then observed it called multiple times). It would be also fine if fields.forEach only memoized…

TechS
- 167
- 1
- 5
- 14
4
votes
4 answers
How to use useMemo with an external API?
I'm working with react-table library for filtering and pagination. I am requesting data from a custom API using Node and rendering it using useTable hook from react-table. The documentation for react-table says the table data should be memoized, so…

yksolanki9
- 429
- 2
- 7
- 14