Andmapco - dev team

https://www.npmjs.com/package/react-lazyload <LazyLoad once> <img src={ data.photos.length > 0 ? data.photos[0].photoUrl : 'url of image' } className={classes.image} alt="Listing" /> </LazyLoad> React-Suspense import React , { Suspense } from "react" ; const OriImg = ( { src , alt } ) => { ImageResource . read ( src ) ; return < img src = { src } alt = { alt } / > ; } ; const LazyLoadImg = ( { src , alt , ratio } ) => { const placeholder = generatePlaceholder ( ratio , "black" ) ; return ( < Suspense fallback = { < img src = { placeholder } alt = { alt } / > } > < OriImg src = { src } alt = { alt } / > < / Suspense > ) ;   } ;   const cache = { } ; const generatePlaceholder = ( ratio , color ) => { const width = 1 ; const height = ratio ; const key = ` ${ rati...

import Carousel from 'react-material-ui-carousel'  https://levelup.gitconnected.com/lazy-loading-images-in-react-for-better-performance-5df73654ea05 < Carousel autoPlay = {false} navButtonsAlwaysVisible = {true} > { ( photos || []). map (( photo , i ) => ( < PhotoViewCard key = { i } photo = { photo } /> )) } </ Carousel >