Stack Overflow
Stack Overflow

Questions tagged [react-memo]

65 questions
1
vote
1 answer

How can I force update React.memo child component?

My main functional component performs a huge amount of useQueries and useMutations on the child component hence I have set it as React.memo so as to not cause re-rendering on each update. Basically, when new products are selected I still see the old…
Ashish
  • 31
  • 2
  • 7
1
vote
1 answer

React Memo updating Parent component state

I have components like below QuestionAnsPage.component(parent): export interface FieldsDatatype { id: string | number; attributeId: string | number, mainQuestionFlg?: boolean; mainQuestionId: number | string, question: string; **values:…
Pradeep Fale
  • 11
  • 2
1
vote
1 answer

Keep Component from Rerendering with Custom Hooks

I have a custom hook useWindowSize that listens to changes of the window size. Once the window size is below a certain threshold, some text should disappear in the Menu. This is implemented in another custom hook useSmallWindowWidth that takes the…
Tobi
  • 363
  • 5
  • 15
1
vote
1 answer

Why the props that are passed to memo are don't store the value

I am trying to optimize my React list rendering using the React memo feature of manual props comparison. I have generated a list of simple "toggle" buttons: import React, { useState } from "react"; import "./styles.css"; import { Toggle } from…
Michał J. Gąsior
  • 1,457
  • 3
  • 21
  • 39
1
vote
1 answer

Error in Component re draw with memoized React component

This is my navbar component. Exports a memoized one. import * as PropTypes from 'prop-types'; import Style from './Navbar.module.scss'; import NavbarItem from './NavbarItem'; import React from 'react'; /** * @param items * @param type */ export…
JorgeeFG
  • 5,651
  • 12
  • 59
  • 92
0
votes
0 answers

Trouble Understanding React.memo on a Component

Please take a look at the following code // index.jsx import React from 'react'; import {data} from '../../../../data.js'; import List from './List.jsx'; const peopleContext = React.createContext(); export const usePeopleContext = () =>…
Bop 1ABot
  • 1
  • 1
0
votes
0 answers

react's memo and UI kit's component (MUI)

I've heard that I must to use memo to wrap component in pair with useCallback, when such type (fn) of props passes in component. There are a simple example, let's imagine that instead of button we have a smart hard component with huge business…
b442
  • 46
  • 3
0
votes
0 answers

When passing parent component function to memo children components, it avoids rerendering only if its parent is class component and arrow function

I am new to React, and in my app, I have to optimize it to avoid unnecessary rerendering. So far, I have found that there is shouldComponentUpdate for React.Component and React.PureComponent, and memo for functional components. I am using memo as I…
Arst
  • 3,098
  • 1
  • 35
  • 42
0
votes
0 answers

React.memo custom comparison not avoiding excessive re-renders in stock trading app

I am working on a performance-critical section of a stock trading React application that involves a large number of components displaying real-time data. I'm using React.memo() with a custom compare function to optimize rendering and avoid…
Jean-Luc KABORE-TURQUIN
  • 1
  • 5
0
votes
1 answer

Will the component be re-rendered every time I enter the page even though the data hasn't changed?

I'm not deep understanding how memo works with the component. I have component like this. It is very simple and it is static. const Home = memo((props: any) => { useEffect(() => { console.log('home changed'); }, []) return ( …
Hai Tien
  • 2,929
  • 7
  • 36
  • 55
0
votes
2 answers

Passing anonymous function with a parameter to child component wrapped in memo

I have a component Marker, which I don't want to rerender unless really needed. So it's wrapped in a memo hook, but since one of the props is an anonymous function, then the Marker still rerenders every time it's parent rerenders. Now, this would…
raouaoul
  • 681
  • 2
  • 13
  • 33
0
votes
0 answers

why react UI Frameworks not use memo or PureComponent by defaults

https://github.com/segmentio/evergreen https://github.com/kiwicom/orbit https://github.com/react-bootstrap/react-bootstrap https://github.com/ariakit/ariakit https://github.com/Semantic-Org/Semantic-UI-React None of these well-known libraries use…
user20058553
  • 1
  • 1
0
votes
0 answers

React.Memo is not working when prevProps and nextProps are the same

const propsAreEqual = (prevProps: IRangeDatePickerProps, nextProps: IRangeDatePickerProps) => { return prevProps.details === nextProps.details; } // At botton of the file, i memoize the component: export default React.memo(RangeDatePicker,…
Gabriel Borges
  • 37
  • 7
0
votes
1 answer

Functional component with React.memo() still rerenders

I have a button component that has a button inside that has a state passed to it isActive and a click function. When the button is clicked, the isActive flag will change and depending on that, the app will fetch some data. The button's parent…
kakakakakakakk
  • 467
  • 10
  • 31
0
votes
1 answer

prevent re render component using React and React-memo

I would like to prevent component re-rendering using React. I've read some guides but I'm still having trouble getting my code to work. The CreateItem component creates an input form from the json object. When the input states change, React…
init
  • 55
  • 8
1 2
3
4 5