GitHub - stereobooster/react-ideal-image: ?️ An Almost Ideal React Image Compone...
source link: https://github.com/stereobooster/react-ideal-image
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
README.md
react-ideal-image
Adaptive image component
The problem
I need React component to asynchronously load images, which will adapt based on network, which will allow a user to control, which image to load.
This solution
Read the introduction.
Table of Contents
Installation
This module is distributed via npm which is bundled with node and
should be installed as one of your project's devDependencies
:
npm install react-ideal-image
Usage
import React from 'react' import lqip from 'lqip.macro' import IdealImage from 'react-ideal-image' import image from './images/doggo.jpg' const lqip = lqip('./images/doggo.jpg') const App = () => ( <IdealImage lqip={{lqip}} srcset={[{src: image, width: 3500}]} alt="doggo" width={3500} height={2095} /> )
Other Solutions
I'm not aware of any which supports all features, if you are please make a pull request and add it here!
Contributors
Thanks goes to these people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!
LICENSE
Code - MIT
Icons - Apache License 2.0
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK