image-optimizer

Scan project directories for large PNG/JPG/JPEG images and convert them to WebP.

Updated Apr 16, 2026
One-click install
npx skills add https://github.com/chuanyue98/prompt-gallery --skill image-optimizer-chuanyue98
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: image-optimizer
Source: https://github.com/chuanyue98/prompt-gallery/tree/main/.gemini/skills/image-optimizer
Command: npx skills add https://github.com/chuanyue98/prompt-gallery --skill image-optimizer-chuanyue98

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires Pillow, and includes scripts (resource) components.

What problem does it solve?

This Skill solves the problem of oversized static images in a project that slow down builds, increase bundle size, and hurt page load performance.

Core Features & Use Cases

  • Scan large images: Finds PNG/JPG/JPEG assets larger than a configurable minimum size while skipping common heavy folders (e.g., node_modules, dist, .next).
  • Batch convert to WebP: Converts qualifying images to WebP using a configurable quality level and reports before/after size savings.
  • Use case: For example, after adding many screenshots to a Next.js site, you can scan for images over 100KB, then convert them to WebP to reduce overall payload size before deployment.

Quick Start

Ask the AI to run image-optimizer in conversion mode on your project folder to convert images larger than 100KB into WebP with quality 85.

Frequently Asked Questions about image-optimizer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert large PNG and JPG images to WebP to reduce build size?

You can convert large PNG and JPG images to WebP by scanning your project directory and batch converting qualifying static assets, which reduces storage and build size for front-end repositories.

Can I scan for oversized static images before converting them to WebP?

Yes, you can run a scan-only mode to find large static images while skipping heavy directories like node_modules, allowing you to review qualifying files before performing any WebP conversion.

What's the best way to optimize Next.js static assets that hurt page load performance?

The best way to optimize Next.js static assets is to scan for oversized screenshots and convert them to WebP using a configurable minimum size threshold and quality level to reduce payload size before deployment.

Does Pillow support batch processing for WebP conversion in Python?

Yes, Pillow supports batch processing for WebP conversion in Python by scanning specified directories for large image files and applying a configurable quality level to report before and after size savings.

How do I configure minimum file size and quality for batch image optimization?

You can configure minimum file size and quality for batch image optimization by setting a path, minimum size threshold, and WebP quality level, while excluding common directories and reporting detailed savings per file.

Why does my front-end bundle size increase after adding screenshots?

Your front-end bundle size increases after adding screenshots because oversized static image files slow down builds and hurt page load performance, which can be resolved by converting large PNG and JPG assets to WebP.