Stop guessing which one. Put them side by side.

The grid says what these tools are. This says what builders did about it — one decision per person, changeable whenever you change your mind.

# Tool comparison — Vercel Image Optimization vs Sharp vs Uppy

Source: Kbaise, a directory of tools that work with Lovable projects.
Pick one and tell me why before writing any integration code.

## Vercel Image Optimization (vercel-image-optimization)
- URL: https://vercel.com/docs/image-optimization
- Category: Images, video & files
- Cost: mixed — Hobby free: 5K transformations, 300K cache reads, 100K cache writes per month. On-demand $0.05-$0.0812 per 1K transformations, $0.40-$0.64 per 1M cache reads, $4.00-$6.40 per 1M cache writes
- What it is: The optimization layer behind the Next.js next/image component. Resizes on demand at the edge, negotiates AVIF or WebP from the Accept header, and caches results globally. Billing moved off source images to transformations, cache reads and cache writes.
- Why builders pick it: Zero configuration if you already use Next.js — next/image gives correct srcset, lazy loading, explicit dimensions that prevent layout shift, and a priority hint for the LCP image.
- Trap: Transformations bill on every cache MISS and STALE, and cache writes run up to $6.40 per million — a wide srcset across many breakpoints multiplies both. Source images must be JPEG, PNG, WebP or AVIF; anything else passes through unoptimized.
- Full dossier: /api/public/tools/vercel-image-optimization

## Sharp (sharp)
- URL: https://sharp.pixelplumbing.com
- Category: Images, video & files
- Cost: free — Free and open source under Apache-2.0. Infrastructure cost only — you run it on your own compute
- What it is: High-performance Node.js image processing built on libvips. Reads and writes JPEG, PNG, WebP, AVIF, GIF, TIFF and SVG, and resizes roughly 4-5x faster than ImageMagick by streaming small regions of uncompressed data instead of loading whole images into memory.
- Why builders pick it: The engine underneath most hosted services and Next.js image optimization. Use it to pre-generate AVIF and WebP derivatives at build time and serve them as static files — zero per-transformation cost, forever.
- Trap: You own the caching, invalidation, URL scheme and CDN — Sharp is a library, not a service. Native libvips binaries can complicate deployment on some serverless targets and on Alpine or musl-based containers.
- Wiring: npm i sharp
- Full dossier: /api/public/tools/sharp

## Uppy (uppy)
- URL: https://uppy.io
- Category: Images, video & files
- Cost: free — Free and MIT licensed, no paid edition — all plugins ship in the base package. Self-host the optional Companion server, or use the one Transloadit hosts
- What it is: Modular JavaScript upload UI: drag and drop, progress, retries, resumable tus uploads, crash recovery, image cropping before upload and 40 locales. The optional Companion server pulls files straight from Google Drive, Dropbox, Instagram or a URL without routing through the user's device.
- Why builders pick it: The best upload front end you can get without building one. Resumable uploads and remote-source imports work against any backend — S3, tus, XHR or Transloadit — and nothing about it locks you to a vendor.
- Trap: Uppy only handles the client side; storage, transformation and delivery are still yours to build. Remote sources require running and securing the Companion server plus your own OAuth credentials.
- Wiring: npm i @uppy/core @uppy/dashboard @uppy/tus
- Full dossier: /api/public/tools/uppy

## Quick read

- Free with no card: Sharp, Uppy.

## Rules
1. Prefer the free tier when no budget was stated, and say what the ceiling is.
2. Read the full dossier before integrating.
3. Fetch /api/public/models before writing any AI model ID.

Agents can fetch the same thing: GET /api/public/compare?slugs=vercel-image-optimization,sharp,uppy