Nanometers Per Millisecond

    lazy-image-reactjs

    1.3.0 • Public • Published

    React Image Lazy Load

    Description

    This package created for the lazy loading images

    • Lazy-loading of images or other content as a page is scrolled.
    • Implementing "infinite scrolling" web sites, where more and more content is loaded and rendered as you scroll, so that the user doesn't have to flip through pages.
    • Deciding whether or not to perform tasks or animation processes based on whether or not the user will see the result.
    • dataSrc attribute allows you to display a placeholder image before displaying a real image
    import LazyImage from 'lazy-image-reactjs';
    
    // By default used this options for IntersectionObserver
    const options = {
      threshold: 0.01,
      rootMargin: '75%',
    }
    
    function App() {
      return (
        <div>
          <LazyImage
            alt="alt"
            src="image.jpg"
            dataSrc="alt.img"
            options={options}
          />
        </div>
      );
    }

    You can play with it in sandbox

    Install

    npm i lazy-image-reactjs

    DownloadsWeekly Downloads

    1

    Version

    1.3.0

    License

    ISC

    Unpacked Size

    3.29 kB

    Total Files

    3

    Last publish

    Collaborators

    • davmatevosyan