sakshamGupta09 / lazy-load-images

A vanilla-js project to demonstrate lazy loading of images using intersection observer and unsplash API for fetching images..

Lazy load images using Intersection Observer API

Demo

Project description

This is a vanilla JS project which uses Unsplash API to fetch the most popular images and render the results onto the UI. It supports lazy loading of images using Intersection Observer API. The layout is completely responsive and supports dark theme as well. All images will have a default placeholder image which is very small in size and actual image will be loaded only once it is in viewport.

Key Features

• Lazy load images using Intersection Observer API.
• Supports dark and light theme.
• Automatically displays the page in user's preferred colour scheme (The OS settings).
• Unsplash API is used for fetching records which supports pagination.
• Completely responsive and elegant UI.
• Uses fetch API for network calls.

Screenshots

1). Dark Mode

2). Light Mode

3). Mobile screen