/Javascript/React/React native pure component vs component

React native pure component vs component

The major difference between React.PureComponent and React.Component is PureComponent does a shallow comparison on state change. It means that when comparing scalar values it compares their values, but when comparing objects it compares only references. It helps to improve the performance of the app.

You should go for React.PureComponent when you can satisfy any of the below conditions.

    State/Props should be an immutable object
    State/Props should not have a hierarchy
    You should call forceUpdate when data changes

If you are using React.PureComponent you should make sure all child components are also pure.

    is there any performance impact in using React.component that we may consider going for React.PureComponent?

Yes, it will increase your app performance (because of shallow comparison)

    I am guessing shouldComponentUpdate() of Purecomponent performs only shallow comparisons . If this is the case can' t the said method used for deeper comparisons?

You guessed it correctly. You could use it if you satisfy any of the conditions I mentioned above.

    "Furthermore, React.PureComponent's shouldComponentUpdate() skips prop updates for the whole component subtree" - Does this mean that prop changes are ignored?

Yes, prop changes will be ignored If it couldn't find difference in shallow comparison.

Source: stackoverflow.com

Similar codes

5 votes187 views4 answers
Export default react
Javascript React
0 vote181 views1 answer
Rngesturehandlermodule.default.direction react native
Javascript React
0 vote223 views1 answer
Add Multilanguage Support to React App
Javascript React
3 votes180 views1 answer
How to go to another page onclick in react
Javascript React
0 vote193 views1 answer
How to call api on load using hooks in react
Javascript React
1 vote184 views1 answer
Column width table react
Javascript React
0 vote192 views3 answers
'App' is not defined react/jsx-no-undef
Javascript React
105 votes190 views1 answer
React simbu
Javascript React
10 votes140 views1 answer
That is neither a react function component nor a custom react hook function. react component names must start with an uppercase letter. react hook names must start with the word "use"
Javascript React
13 votes197 views5 answers
React native setup
Javascript React