Heavy product shots and full-bleed heroes wreck Core Web Vitals before copy ever loads. You bring the file, cap the longest edge, nudge quality, pick JPEG PNG or WebP, then read the approximate byte change before saving. Pair with the compressor when you want a second opinion on aggressive squeezes.
Drop a photo or tap to browse
PNG, JPEG, WebP, GIF decode for preview. Export picks your selected format.
WebP encoding is not available here, so the build fell back to JPEG.
Waiting for a file.
Run a build to see output.
Figures come from the data URL length your browser produces. They track real downloads closely enough for A versus B comparisons, not for billing audits.
The page reads your image into an HTML canvas, rescales when the longest edge exceeds the cap you picked, then asks the browser encoder for a blob in JPEG, lossless PNG, or WebP.
Each step is deterministic: same inputs yield the same output on a given browser build. That predictability helps when you are lining up before-and-after shots for a stakeholder deck.
Editorial note: We recommend WebP for public marketing pages when analytics show most visitors on evergreen desktop browsers. Keep PNG for crisp UI chrome with flat color blocks.
Quality sliders move bits, yet the largest wins still come from geometry. A 6000 pixel-wide retail photo scaled to 1920 removes more bytes than cranking JPEG from 85 down to 65 on the original monster.
Start with the edge cap, then touch quality. If banding shows up on skies, lift quality five points instead of abandoning WebP.
Content editors use the flow when Shopify or WordPress rejects a 9 MB upload. They cap width, pick WebP, download, re-upload. No desktop apps required.
Front-end leads keep a bookmark for sprint demos: they rebuild the hero asset live while Lighthouse is open, proving the metric moved.
Email producers still export PNG slices for Outlook-heavy lists, then switch to JPEG for web-only follow-ups. The segmented control makes that swap obvious for junior contractors.
| Format | Best when | Trade-off |
|---|---|---|
| JPEG | Photography, gradients, noisy backgrounds | Lossy; harsh on flat UI fills |
| PNG | Sharp edges, transparency, screenshots | Larger than WebP for photos |
| WebP | Modern browsers, mixed photo plus alpha | Older Safari builds need a fallback plan |
Need a batch of unrelated extensions cleaned first? Route through the format converter so naming stays consistent before you optimize.
Color profiles survive canvas round trips differently across engines. A photo tagged Display P3 might flatten to sRGB without warning. For brand-critical gradients, open the download in an inspector you trust.
Second, animated GIFs decode to the first frame here. You will not preserve motion. Split frames elsewhere, then optimize stills.
Third, EXIF orientation is baked visually once pixels hit the canvas. That is usually what you want for the web, yet you lose camera metadata for archival workflows. Keep a raw master offline.
CDN caches do not care how hard you worked inside the browser. Purge keys the moment you replace a filename that already ships on the homepage. Otherwise visitors keep the bloated object for days.
Versioned query strings still beat polite e-mails to infrastructure teams. Name files with a short hash or date stamp whenever marketing runs weekly promos.
When legal requests a before-and-after record, store the original upload plus the optimized download in the same ticket. The delta column in this UI becomes evidence without another spreadsheet.
Canvas export is not a perceptual model. The byte estimate skips metadata stripping, progressive scan tuning, and vendor-specific mozjpeg tricks. Treat numbers as directional.
Safari and Firefox occasionally disagree on WebP alpha. Always open the download locally before replacing production CDN objects.
Toolexe maintains image utilities on a rolling review cycle. Last reviewed March 2026. When browser vendors change canvas encoding, we adjust the limitations block first.
Downloaded files include browser headers; gzip on the wire is separate. Compare Lighthouse filmstrips, not spreadsheet guesses, when you need proof for executives.
Short answers tied to this optimizer, not generic hosting advice.
JPEG and WebP are lossy unless you push quality to the top. PNG stays lossless but grows large. If softness appears at quality 90, your source may already be over-compressed, or the edge cap downscaled more than you expected.
No. The FileReader API loads bytes into memory inside your tab. Closing the tab clears them unless your browser keeps its own cache.
Some embedded WebViews lack a working toDataURL WebP encoder. The tool falls back to JPEG and surfaces a short notice so you are not surprised by the extension.
Usually within a few percent of the saved file, because base64 length tracks output bytes. Huge ICC profiles or exotic color spaces can skew the relationship.
Yes. Real user metrics include CDN TTL, HTTP version, and third-party scripts. This optimizer only addresses the image payload slice.
