https://github.com/rubenspgcavalcante/progressive-image-loading
A live example of progressive image loading strategies
https://github.com/rubenspgcavalcante/progressive-image-loading
example intersectionobserver progressive-image-loading react webpack
Last synced: 8 months ago
JSON representation
A live example of progressive image loading strategies
- Host: GitHub
- URL: https://github.com/rubenspgcavalcante/progressive-image-loading
- Owner: rubenspgcavalcante
- License: mit
- Created: 2018-03-21T08:14:56.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2019-04-12T13:25:27.000Z (almost 7 years ago)
- Last Synced: 2025-04-07T17:41:35.720Z (12 months ago)
- Topics: example, intersectionobserver, progressive-image-loading, react, webpack
- Language: JavaScript
- Size: 1.63 MB
- Stars: 49
- Watchers: 1
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Progressive Image Loading
## What this repository is for?
A small example of the how to apply progressive image loading and some strategies currently used on web apps for that.
Original post on Medium: [Progressive Image Loading and IntersectionObserver](https://medium.com/front-end-weekly/progressive-image-loading-and-intersectionobserver-d0359b5d90cd)
Check it here: [progressive-image-loading.surge.sh](https://progressive-image-loading.surge.sh)
### Dependency
This project depends in a GO lib, called [primitive](https://github.com/fogleman/primitive).
Before running the `yarn pre-build` you need to install `primitive`.
### Setup
First run `yarn install` to install the dependencies and then, run `yarn pre-build` to generate the image placeholders and
finnally `yarn start` to run the webpack-dev-server.
### Credits
[Ramphastos toco TOCO TOUCAN](https://flic.kr/p/Vn4qa3) by Dr. Nasser Halaweh - Picture under creative commons license
### License
This project is under the MIT license