imachi 🌖

Tiny image loader.

pnpm + Vite(library mode) + biome + Vitest + Playwright + release-please

Installation:

# yarn
yarn add -D imachi
# npm
npm install -D imachi
# pnpm
pnpm i -D imachi

Import:

import{imachi}from"imachi";

Usage:

constloader=imachi('img');// progressloader.progress((event)=>{console.log(`Loading progress: ${event.progress.percentage}%`);});// doneloader.done((event)=>{console.log(`All images loaded: ${event.total} images`);});// failloader.fail((event)=>{console.error(`Failed to load image: ${event.src}`);});

Events

.progress

Called each time an image loads successfully.

constloader=imachi('img');loader.progress((event)=>{console.log(`Loading progress: ${event.progress.percentage}%`);});

• imageElement: HTMLImageElement - Loaded image
• progress
  • count: number - Current count
  • percentage: number - Load completion (%)
  • total: number - Total count

---

.done

Called when the entire loader process finishes.

constloader=imachi('img');loader.done((event)=>{console.log(`All images loaded: ${event.total} images`);});

• images: [] - Loaded images
  • src: string - Image source
  • element: HTMLImageElement - Image element
• total: number - Total count

---

.fail

Called when an image fails to load.

constloader=imachi('img');loader.fail((event)=>{console.error(`Failed to load image: ${event.src}`);});

• src: string - Image source
• element: HTMLImageElement - Image element
• error: Error - Error object