Marcelo Carmona
Published on

Evitar re-renders innecesarios con React.memo

Authors

No queremos re renderear un component si la data de ese componente no cambio, en muchos casos un componente se re-renderiza cuando las props cambian.

En este ejemplo renderizamos un nuevo Title por cada click en el botón.

Con la función memo podemos pasar un stateless functional component y podemos estar seguros que el componente no se actualizará si las props no cambian.

Con class podemos usar pureComponent

Y tambien es posible usar shouldComponentUpdate

Cuidado: shallowCompare es un legacy add-on. Usar memo o PureComponent