preact-lazy-img

Lazy load images when the user scrolls over them.

NOTE: DO NOT USE IN PRODUCTION! STILL WORK IN PROGRESS!!!!

Foundation based on react-lazy

Install

    $ npm install preact-lazy-img

Usuage Example:

 
import {LazyImg, LazyImgWrapper } from 'preact-lazy-img';
 
<LazyImgWrapper>
    <LazyImg src='/asset/myimage.png'>
</LazyImgWrapper>
 

.lazyload-placeholder {
    background: gray;
    height: 300px;
    width: 300px;
    display: inline-block;
}

Todos:

• Implement Travis CI.
• Write more unit tests surrounding LazyImg and LazyImgWrapper.
• Create CodePen Demo.
• Allow child LazyImg props to be overwrite parent LazyImgWrapper.
• Write more documentation around available props.
• Upgrade to Webpack 4. (low)

Credits

• Preact
• Babel
• Eslint
• Jest
• Enzyme
• Webpack

License

MIT