React

Question 1

how can use props to optimize React re-renders

Answer 1

“Lift” the expensive component to a parent where it will be rendered less often.
Then pass the expensive component down as a prop.

Basically you can render a prop {props.anything} like {children}
and if anything is a component, it won’t rerender in next child’s rerenders

• article
• example

Question 2

what pure component in react?

Answer 2

• when using class componenst we had pure component, it was check the props to check if needs to rerender or not
• now in hooks (functional component) it’s pure by default (expect key)

Question 3

what is error boundery component in react ?

Answer 3

it helps you limit the impact of an error, it allows you to not broke the app by breaking one component, and gives you a place holder to show a message by wrapping it

allows to localize the errors and manage them

Question 4

useEffect hooks ?
why it doesn’t accept async

Answer 4

• trigger a side effect
• when a deps changes
• it runs after component rerender and maybe rerender again

why async ?
the return function of effect (clean up) accepts only synchronous function

allowing it causes unintentional side effects or race conditions.