¿Conocías Lazy y Suspense de React? ¿Lo habías usado antes? ¡Cuéntamelo por aquí!

@carmendelcampomunoz4649

Жыл бұрын

Soy yo Tomi por otra cuenta

@erickruben5536

9 ай бұрын

La verdad que no, intentaba hacer otras cosas para hacer una pantalla de carga pero tu lo has hecho muy sencillo muchas gracias

Muy bien explicado y al grano. Gracias

@manuelsanchezweb

Жыл бұрын

Gracias, Nicolas! 💪

funciona, gracias

Hola Manuel, caí en este video de casualidad. Para mi el lazy loading es algo nuevo y lo he entendido en 5 minutos gracias a tí. Te has ganado un nuevo subscriptor. Saludos desde ARG

@manuelsanchezweb

6 ай бұрын

Vamos! Buenísimo! Pues nada, estate atento por aquí que suelo sacar temas de React/Next que tienen que ver con mejoras de rendimiento! Un saludo desde Hamburgo!

Buen aporte amigo, muy claro!

@manuelsanchezweb

Жыл бұрын

Gracias a ti por el feedback!

Genial! gracias por la ayuda!

@manuelsanchezweb

6 ай бұрын

De nada!

no encontre tu version de la pokedex, pero me di cuenta que usar Lazy y Suspense no espera a que termine de cargar las imagenes (solo los componentes) :(, me pregunto si habra una forma que termine de cargar el componente con imagenes y recien mostrar la pagina completa

@manuelsanchezweb

5 ай бұрын

Buenas! Suponía que eso debía funcionar ya así con React 18, le echaré un vistazo a ver! Gracias por tu comentario!

@ellocoralf1341

11 күн бұрын

Puedes usar el atributo de loading='lazy' para hacer que cargue la imagen solo cuando estén apunto de entrar en viewport. Te recomiendo que combines eso con lo que muestra el vídeo para más rendimiento.

Excelente

@manuelsanchezweb

7 ай бұрын

🤙🤙💪💪

Amigo haga zoom in a ese codigo.

Hola que tal? Muy buen video, consulta por lo que investigue se dice que las api rest son stateless esto es a nivel servidor o cliente? En el caso por ej de react que tb se habla de componentes con y sin estado es a nivel cliente o servidor? No me queda del todo claro. Graciass

@manuelsanchezweb

6 ай бұрын

Muy buenas, no entiendo muy bien la pregunta, de primeras te respondería cliente, pero no entiendo bien la pregunta. Tienes un link?

Buenisimo! En caso de no usar outlet donde deberia ir el suspense?

@manuelsanchezweb

6 ай бұрын

El suspense lo puedes poner de wrapper de cualquier elemento al que quieras esperar. Cuando digo esperar, me refiero a que se cargue todo lo que haya dentro de ese elemento, fetching de datos incluido por ejemplo. Tienes mucha info al respecto aquí: react.dev/reference/react/Suspense. ¡Es una superbuena práctica que con React 18 se ha vuelto muy fácil y recomendable de utilizar!

Funciona todo perfecto , pero si llamara mi componente supongamos comentarios, desde otro componente, y ahí ya no me carga el componente, tendría que poner suspense en ese componente también o como podría solucionar ese tema? Muchas gracias por tu ayuda

@manuelsanchezweb

5 ай бұрын

Buenas! He tardado un poco en contestar porque estaba pensando bien qué decir. Mi respuesta a priori es que depende. Imagino que tienes algo como ChildComponent (el que ya tiene Suspense) y el ParentComponent. Si es el único Child, debería ser suficiente con ponerlo en el Child. Esto sería Isolated Suspense. Si tienes varios children y todos o muchos tienen alguna movida asíncrona, sí te merece la pena hacer un Suspense en el ParentComponent. Y lo que tú sugieres, que es NestedSuspense, hacer Suspense en los dos, también es posible con React, y te permite un control mucho más detallado de cada uno de los estados. Total, que depende un poco del caso que tengas. Espero que haya sido más o menos de ayuda!

Super sencillo, recuerden que solo para React 18 y mayores

@manuelsanchezweb

7 ай бұрын

Exacto, PEGI 18, pronto se vienen algunas buenas prácticas con React que se añadieron con React 18!

Buen video, el único defecto es que me quedé esperando aquello que dijiste, de que hay manera de hacer que solo cargue el componente que se está usando, aun hayas cliqueado el resto.