Loading...
Loading...
Batch optimize images for web delivery. Converts to WebP, generates multiple sizes, and creates blur placeholders.
npx skill4agent add forever-efficient/pitfal-solutions-website optimize-images$ARGUMENTS./public/imagesfind ${ARGUMENTS:-./public/images} -type f \( -name "*.jpg" -o -name "*.jpeg" -o -name "*.png" \)# Install sharp-cli if not present
pnpm add -D sharp-cli
# Optimize single image example
npx sharp -i input.jpg -o output.webp --format webp --quality 80
# Generate srcset for an image
for size in 320 640 1280 1920 2560; do
npx sharp -i input.jpg -o "output-${size}w.webp" --resize $size --format webp --quality 80
done
# Generate thumbnail
npx sharp -i input.jpg -o thumb-150.webp --resize 150 150 --fit cover --format webp
# Generate blur placeholder
npx sharp -i input.jpg -o blur.webp --resize 10 --format webp --quality 20