React.lazy es una función que nació en la versión 16.6 de React siguiendo el concepto de 'lazy loading' ya presente en liberías como 'react-loadable'.
¿Que es lazy loading?
Lazy loading o carga diferida es un patron de diseño que tiene como objetivo retrasar la carga de un objeto hasta el momento en que sea utilizado. Este patrón resulta ser una gran herramienta a la hora de implementar una intefaz de usuario puesto que la carga de distintos elementos de forma secuencial resulta ser un obstáculo para la eficiencia.React.lazy tiene como objetivo permitirnos cargar solo lo que "necesitemos en el momento", haciendo que la carga del viewport sea mas ligera. React.lazy toma como argumento una función asíncrona que devuelve una promesa. Dicha promesa es la importación de un component e.
React.lazy "envuelve" a la función que retornará un componente. Luego si queremos hacer uso de este componente:
