react-srcset-image
v1.1.1
Published
react-srcset-image React component : create srcset images + blur loading
Downloads
8
Maintainers
Readme
react-srcset-image
React component to optimize your images based on srcset
and add an automatic medium-like blur animation.
- Creates srcset images with webpack and responsive-loader.
- Embed base64 blurred placeholder (default: 100x100)
- Animate between placeholder and final image
Demo : http://revolunet.github.io/react-srcset-image
:warning: This component needs webpack to produce multiple images sizes for you.
:warning: Target images needs to be statically defined.
Usage
import Image from 'react-srcset-image'
// webpack responsive-loader config
const imageSrc = require('responsive-loader?placeholder=true&sizes[]=500,sizes[]=1000!./image.jpg');
const Demo = () => <Image responsiveImage={imageSrc}/>