Lossy vs Lossless Image Compression
Understand what lossy and lossless compression change, which formats use each method, and how to choose the right approach for photos, graphics, and web images.
In this guide
Lossy and lossless describe what an encoder is allowed to do with image data. Lossless compression preserves enough information to reconstruct the encoded pixels exactly. Lossy compression deliberately discards or approximates information to make a smaller file.
That distinction is useful, but it is not the whole decision. A lossless file can still be unnecessarily large, while a carefully encoded lossy image can look unchanged at its intended display size. The right choice depends on what the image contains, whether it will be edited again, and how much fidelity the final use requires.
The practical difference
The MDN image format guide identifies PNG as a lossless format, JPEG as lossy, and WebP and AVIF as formats that can use either mode. In day-to-day work, those modes behave differently:
| Question | Lossless compression | Lossy compression |
|---|---|---|
| Can the encoded pixels be reconstructed exactly? | Yes | No |
| Where do file-size savings come from? | More efficient representation of repeated or predictable data | Efficient representation plus discarded or approximated detail |
| What happens after repeated encoding? | Re-encoding should not introduce visual degradation if pixels and settings stay unchanged | Each new lossy encode can introduce more artifacts |
| Typical web formats | PNG; lossless WebP; lossless AVIF | JPEG; lossy WebP; lossy AVIF |
| Best fit | Masters, screenshots, line art, text, and graphics that need exact edges | Photographs and delivery files where smaller size matters more than pixel-for-pixel reproduction |
Lossless does not mean uncompressed. A PNG can be much smaller than its raw pixel data because its encoder represents that data efficiently. It simply has fewer ways to reduce the file than a lossy encoder, which may also simplify fine texture, color detail, or other information.
The format name does not tell the whole story
It is tempting to treat every PNG as lossless and every WebP as lossy. That can lead to incorrect conclusions because image processing often has several stages:
- The application may resize the image.
- It may reduce the number of colors or change chroma sampling.
- It may remove metadata.
- It encodes the resulting pixels in the selected format.
A PNG encoder can store its input pixels losslessly after an earlier step has reduced the color palette. The result is a valid PNG, but it is not necessarily pixel-identical to the original file. The same principle applies to resizing: lossless encoding cannot recover pixels removed before encoding.
TinyImage's PNG compressor may reduce the color palette while searching for a smaller output. That is useful for many web graphics, but it means you should inspect subtle gradients, shadows, and brand colors instead of assuming the result is mathematically lossless. Keep the source file if exact color values matter.
Metadata is separate from rendered pixels. Removing an embedded camera location, author field, thumbnail, or editing record can make a file smaller without changing what is displayed. It can also remove information you intended to keep. Check the metadata requirements of archival, legal, and publishing workflows before stripping it.
What lossy compression changes
JPEG divides image information into blocks and quantizes detail. The web.dev JPEG guide explains why this works well for the gradual changes found in photographs and why aggressive settings expose block boundaries, ringing, or blur.
Common warning signs include:
- halos around text and high-contrast edges;
- block patterns in smooth skies or walls;
- smeared hair, grass, fabric, or other fine texture;
- color bleeding around saturated edges;
- banding where a smooth gradient becomes a set of visible steps.
These artifacts are content-dependent. A setting that looks clean on a portrait may damage a screenshot containing small text. This is also why a quality value should not be treated as a percentage of detail retained.
Lossy compression is most vulnerable to generational loss. Suppose a product photograph is exported as JPEG, uploaded to a service that recompresses it, downloaded, edited, and exported as JPEG again. Each encoder works from the already altered result rather than the original camera data. Keeping a high-quality master avoids that chain.
Choose by the job the image has to do
| Use case | Sensible starting point | Reason |
|---|---|---|
| Photograph used once on a website | Lossy JPEG, WebP, or AVIF | Fine photographic detail usually tolerates perceptual compression well |
| Screenshot with small text | PNG or lossless WebP | Sharp edges reveal lossy artifacts quickly |
| Transparent logo or interface asset | PNG or a WebP/AVIF mode that preserves alpha | JPEG cannot store an alpha channel |
| Working file that will be edited repeatedly | Original project file or a lossless master | Avoids compounding lossy changes between edits |
| Downloadable archival or print source | A format and profile required by that workflow | Web delivery size is secondary to preservation and interoperability |
| Thumbnail derived from a retained master | Lossy modern format | The derivative can be regenerated if settings change |
For most publishing workflows, the strongest approach is not choosing one mode forever. Keep a lossless or original master, then create smaller delivery derivatives for each placement.
A repeatable comparison workflow
- Preserve the source. Work from a copy and keep the original outside the output folder.
- Set final dimensions first. Comparing an oversized original with a correctly sized derivative mixes resizing and compression into one decision.
- Choose a format for the content. Start with PNG or lossless WebP for sharp graphics, and JPEG, WebP, or AVIF for photographs.
- Inspect at the intended display size. This is the view the audience will see.
- Check vulnerable details at 100%. Look at text, facial features, high-contrast borders, gradients, and transparency.
- Compare bytes as well as appearance. A conversion is not useful if it creates a larger file without another benefit.
- Record the chosen format and settings. Repeatable rules are easier to maintain than manually guessing for every upload.
You can run that process with the general image compressor, or start with the format-specific JPEG compressor and WebP compressor. For practical starting values and a result-comparison workflow, see the guide to image compression settings.
Common questions
Is PNG always lossless?
PNG's encoding is lossless, but an application can resize the image or reduce its palette before writing the PNG. Check whether a tool promises pixel-identical optimization or uses visual optimization to reach a smaller result.
Is WebP lossy or lossless?
It can be either. WebP also supports transparency and animation, so the extension alone does not reveal which mode or settings produced a particular file.
Can I make a JPEG lossless by converting it to PNG?
No. PNG will preserve the pixels it receives, but it cannot reconstruct detail discarded by the earlier JPEG encode. The new PNG may also be larger.
Should every website image use lossy compression?
No. Lossy delivery is often suitable for photographs, while screenshots, diagrams, small text, and precise graphic assets may need lossless output. Select by content and inspect the result.
Can compressed detail be restored later?
Not reliably. Sharpening or enhancement may change the appearance, but it does not recover the original discarded data. Retain the source or a high-quality master.