Questions tagged [react-memo]
65 questions
0
votes
1 answer
Why are React defaultProps not passing values?
import { memo } from 'react';
import classNames from 'classnames/bind';
import styles from './Button.module.scss';
const cn = classNames.bind(styles);
const Button = memo(
({ design: { size, color, outline, hover }, content, type, onClick }) =>…
Gianna
- 205
- 2
- 12
0
votes
1 answer
Problems with multiple rerendering in React - Add to Favourite List example
I am building a small framework for e-commerce or blog app using React.
One of the features of this framework is an "Add to Favourite List" function.
The app tree works as follow :
App file stores the selectedItem chosen by the Menu, and then App…
FJTAIL
- 107
- 9
0
votes
1 answer
in React app profiling child re-rendering with memo
In the profiling result the component (Table) uses React.memo and it is shown that did not re-render
but underneath there is shown the same Table component and in Why did this render is mentioned that parent re-rendered
The Table uses memo this…
koubin
- 579
- 5
- 9
- 30
0
votes
1 answer
React child components out of sync when using memoization
I have a component that consists of several "bigger" subcomponents, one of them being a custom form CustomForm, which in turn consists of several custom input fields CustomField.
To improve the performance of the page I want to memoize that form so…
Colle
- 154
- 1
- 11
0
votes
2 answers
How to split words further into letters in react hooks
I have made a split of the Text. Now I want to split it further into a single letter/character. Further I want to extent the splitting process to a set of array which is inside the content.
Below is my react code:
import React from "react";
…
Srinivas Murthy. N.A
- 74
- 2
- 15
0
votes
1 answer
Pressing on Delete button in React native flatlist re-renders whole list
I have a list of Contacts in the Flat list, I have made a random color generator function that will generate random background colors for the contacts profile image placeholder with the user's First Name Initials. I have added a delete button to the…
Mantu
- 1,017
- 1
- 10
- 21
0
votes
1 answer
Why is the (memoized) child component re-rendering?
I have two React functional components: C1 and C2. C2 is nested inside C1:
const C2 = () => {
console.log("C2 Render");
return (
I am Component 2
);
};
const C1 = () => {
const [text, setText] = useState("Hello");
const MC2…
Andry
- 16,172
- 27
- 138
- 246
0
votes
2 answers
Avoiding re-render unchanged items
I'm trying to improve the performance of a long list with changeable items using React.memo, but I'm getting strange behavior.
Steps to reproduce:
1 - Go to the sandbox here
2 - Press add on the first item
3 - Press add on the second item
import…
rayashi
- 1,721
- 3
- 20
- 28
0
votes
0 answers
How to memoize the component inside map loop in reactjs
I'm creating a similar to netflix app. I have the below use case:
movies.map((movie) => (
))
I'm wrapping Card component under React.memo but even…
Isha Mahajan
- 25
- 9
0
votes
0 answers
React.memo shows an error when applied to js arrow function component
The functional component:
const NewRestRequestCoreForm = props => {
const intl = useIntl();
....
return (
....
);
}
export default React.memo(NewRestRequestCoreForm);
WebStorm shows…
usertest
- 2,140
- 4
- 32
- 51
0
votes
1 answer
React Native how to use React.memo on every component from collection to render only changed ones. Strange behavior of React.memo
I have been trying to improve rendering performance by using React.memo on components. It works properly until I use it on every single component from the collection being inserted as children.
I prepared snack HERE
To understand what is going on…
kkris1983
- 471
- 1
- 7
- 15
0
votes
0 answers
Preventing render in functional component (React.memo not suffcient)
I have a memoized functional component. Once the parent library component renders, react calls update memo component to check whether my func. component needs to render again. The comparison "current.ref === workInProgress.ref" fails and causes…
user9381708
- 3
- 3
0
votes
1 answer
React component (react-redux props) keeps rerendering with React.memo()
Im building a chat application with react, react-redux and socket.io. Now, to improve the performance of the app i've add React.memo() to my
Tony Caterev
- 127
- 1
- 2
- 13
0
votes
2 answers
React.memo and typescript
I am working on a react native app. I am currently using Item component to display data in flatlist. But editor gives me an error for the second parameter of React.memo like below.
Type 'boolean | undefined' is not assignable to type 'boolean'.
Type…
Oğulcan Karayel
- 395
- 1
- 7
- 19
0
votes
1 answer
Memorize fetched results in component
I'm working on a component that adds images to items. You can either upload your own image or pick an image, loaded from an API based on the name of the item.
Here is the root component:
const AddMedia = (props) => {
const [currentTab,…
tdranv
- 1,140
- 11
- 38