Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

222
Vistas
React Native - How to memoize a component correctly?

This is my parent component:

const A = () => {
   const [data, setData] = useState([]);
   const [isLoading, setIsLoading] = useState(true);

   const isFetching = useRef(false);
  
   ...

   const fetchMoreData = async () => {
      if(isFetching.current) return;

      isFetching.current = true;

      setIsLoading(true);
      
      try {
        const newData = await ... 

        setData([...data, ...newData]);
      } 
      catch(err) {
         ...
      }

      setIsLoading(false);

      isFetching.current = false;
   }

   ...

   return <B data={data} isLoading={isLoading} onEndReached={fetchMoreData} />
}

And I am trying to memoize my child component B, to avoid unnecessary re-renders. Currently, I am doing the following:

const B = memo(({ data, isLoading, onEndReached }) => {
   ...

   return (
     <FlatList 
        data={data}
        isLoading={isLoading}
        onEndReached={onEndReached} 
     />
   );
}, 
(prevProps, nextProps) => {
    return JSON.stringify(prevProps.data) === JSON.stringify(nextProps.data) &&
       prevProps.isLoading === nextProps.isLoading;
});

But, I think, that my memoization can cause problems... as I am not adding prevProps.onEndReached === nextProps.onEndReached

But... all works fine :/ Btw I suppose that there can be a little chance to see unexpected things happening because of not adding it. What do you think? Is it necessary to add methods in the areEqual method?

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda