Content encoding
None of the encodings listed are involved with patent concerns.
Usage | Encoding | Extension |
---|---|---|
Rasterized image | JPEG XL | .jxl |
JPEG | .jpg |
|
WebP | .webp |
|
AVIF | .avif |
|
Vector image | SVG | .svg |
Lossy audio | Opus | .opus |
Vorbis | .ogg |
|
AAC-LC | .m4a .aac |
|
Lossless audio | WavPack | .wv |
FLAC | .flac |
|
Web compression | Zstd | .zst |
Brotli | .br |
|
gzip | .gz |
|
Bundle compression | lzip | .lz .tlz |
bzip2 | .bz2 .tbz2 |
|
xz | .xz .txz |
|
Font | WOFF2 | .woff2 |
Read below for further details.
Rasterized image encoding
Lossy still
As WebP is properly supported in every browser built for systems newer than Windows XP, and it offers better quality-to-size ratio than all JPEG encoders, it is considered the best fallback format. However, as JPEG XL exists as an all-around better universal image format, lossy images should also be encoded with JPEG XL whenever possible.
Compared to all other image formats, JPEG XL offers jawdropping image fidelity, unmatched quality-to-size ratio, proper progressive loading and better responsiveness. The cherry on top of JPEG XL would be its ability to losslessly transcode from existing JPEG files, offering about 20% size reduction with cheap JPEG lossless bitstream reconstruction, which paves its way to be a backwards-compatible drop-in replacement for image storage and distribution.
Things to take notice of:
- mozJPEG-fronted JPEG, while offering a good choice for backwards-compatibility, shouldn't be used unless necessary when size is a consideration. mozJPEG is generally superseded by
jpegli
. - AVIF offers an advantage on size, when progressive support, boundary artifacts and codec performance (slower than all others multiple times) aren't in consideration.
- AVIF is observed to have fewer observable artifacts for images with a simpler shading.
- The reference AVIF settings provide a balancing point between JXL
-d 1
and JXL-d 2
. jpegli
for JPEG from the JPEG XL team provides a reasonable front for backwards-compatible JPEG XL encoding. The estimated file size on fronted JPEG XL files are around 82.5% of the original JPEG files.
Explanations of image encoding uses:
- Delivery: Size-first with generally-acceptable quality.
- Delivery+: Balance between size and quality.
- Near-lossless: Shaving as much size as possible, while still being mostly indistinguishable, even when zoomed in at 200%.
Uses | SSIMULACRA2 | Butteraugli | DSSIM |
---|---|---|---|
Delivery | 80 | 2.0 | 0.0008 |
Delivery+ | 85 | 1.0 | 0.0004 |
Near-lossless | 90+ | 0.4- | 0.0001- |
The size ratio values listed below approach expectations on a large scale, based on experiments conducted on a relatively large scale with non-photographic images modelling 15.6% lossy inputs. Lossless inputs induce better (smaller) expectations, while lossy inputs tip the balance in reverse. Photograpic images will generally have a better (smaller) ratio than non-photographic images, but individual images may still yield greatly varied results.
Codec | Use | Params | Ratio |
---|---|---|---|
JPEG XL | Delivery (quality) | cjxl -j 0 -d 2 -e 7 -p --progressive_dc 1 |
8.52% |
Delivery (speed) | cjxl -j 0 -d 2 -e 4 -p --progressive_dc 1 |
- | |
Delivery+ | cjxl -j 0 -d 1 -e 7 -p --progressive_dc 1 |
14% | |
Near-lossless | cjxl -j 0 -m 1 -d 0.2 -e 7 |
32.6% | |
WebP | Delivery (quality) | cwebp -m 5 -psnr 56 -qrange 90 99 |
21.2% |
Delivery (speed) | cwebp -m 5 -q 95 |
16.8% | |
Delivery+ | cwebp -m 5 -q 99 |
- | |
Near-lossless | cwebp -near_lossless 60 |
62.3% | |
JPEG | Delivery | cjpegli -d 1 -p 2 |
16.8% |
AVIF | Delivery | [effort=4,lossless=false,Q=90] |
15.7% |
The full feature set comparison chart is available on Cloudinary.
Lossless still
JPEG XL lossless and WebP lossless are mostly on par, either could be the better solution at times. For compatibility reasons, WebP lossless should always be offered, while JPEG XL lossless could be offered only when the resulting file is smaller than that of WebP lossless. AVIF lossless is currently consistently worse than either JPEG XL or WebP, as such it's not recommended at all.
Do not enable progressive encoding for JPEG XL lossless, or the resulting file will be several times bigger than PNG files.
Codec | Parameters | Ratio |
---|---|---|
JPEG XL | cjxl -j 0 -d 0 -e 7 | 70.2% |
WebP | cwebp -m 6 -lossless | 78.1% |
Lossy animated
Lossy animated WebP is the current baseline for animated image sequences, while lossy animated AVIF offers the best quality against others by a wide margin. Lossy animated JPEG XL doesn't offer a significant advantage against WebP, and is currently beaten by AVIF.
Audio encoding
Lossy
When high sampling rates are required, choose Vorbis. When support for the Apple ecosystem is required, choose AAC-LC. Otherwise use Opus under all possible scenarios, but beware that Opus only supports sampling at 48kHz.
Below are the suggested bitrates under different scenarios, when encoding stereo audio content under either 44.1kHz or 48kHz. Audio content should be encoded with constrained variable bitrate (CVBR).
The AAC-LC encoder in question is libfdk_aac
, being the best FOSS AAC-LC encoder out there. The only AAC-LC encoder better than libfdk_aac
is Apple's Audio Toolbox, which is proprietary and not in consideration.
Codec | Basic | Stream | Balanced | Generic | Quality |
---|---|---|---|---|---|
Opus | 96kbps | 144kbps | 160kbps | 192kbps | 256kbps |
Vorbis | 128kbps | 160kbps | 192kbps | 224kbps | 320kbps |
AAC-LC | 128kbps | 160kbps | 192kbps | 224kbps | 320kbps |
Keep in mind that the scenario under "basic" indicates that, all audio content encoded with provided parameters should be virtually indistinguishable from LAME-encoded MP3 files at 192kbps.
Lossless
Streaming lossless audio is generally considered a bad idea due to high bandwidth usage. It's generally more useful for archival purposes.
You should choose FLAC when...
- Browser support is needed.
- The target is severely underpowered.
- The target only supports FLAC for lossless audio compression.
You should choose WavPack when...
- You need a smaller file.
- Higher bit depth is needed (more than 24).
Codec | Parameters |
---|---|
WavPack | wavpack -hhvx -x 3 |
FLAC | flac -V8 -e --no-padding -f |
Additional considerations:
- If you do not intend to distribute high bit-depth lossless audio, but the input you have is of high bit-depth, you can re-sample it to somewhere between 16-bit (-96 dB) and 24-bit (-144 dB). Use
--pre-quantize=16
for WavPack.
Compression
Web
Brotli should be preferred over gzip
at all times. Static low-entropy content (e.g. plain text files) should always be pre-compressed, with or without the original uncompressed file available. For dynamic content compression, zstd
at level 8 consumes significantly less than the resources used for Brotli, all the while outperforming Brotli in terms of output size.
For static precompression, the original file can be omitted when the space is constrained, serving only precompressed blobs. When compatibility with other infrastructure isn't in consideration, precompressed gzip
files can also be omitted, although it's not recommended in most cases. zstd
isn't suitable for static precompression, as even at compression level 22 it falls behind Brotli at its highest compression level. However, a recommendation is still available for reasonable reference. Zopfli is an alternative compressor for gzip
, which --i1
outperforms gzip
even at level 9, however only --i1
and --i2
are recommeded for general use.
The table below provides a quick reference of levels and estimated size reduction by use case.
Algorithm | Use | Params | Reduction Ratio |
---|---|---|---|
Brotli | Dynamic | brotli -4 |
69.64% |
Static | brotli -q 11 |
73.41% | |
Zstd | Dynamic | zstd -7 |
69.82% |
Static (not recommended) |
zstd -19 |
72.92% | |
gzip | Dynamic | gzip -4 |
66.48% |
Static | zopfli --i1 |
68.08% |
On a case-by-case basis, Compression Tester could be used to see algorithms in action. For a more comprehensive comparison, Morotti's Compression Results could be used.
Bundle
lzip
is the de-facto standard of bundle compression, featuring good compression ratio with data recovery abilities. Quality should always set to 9
, unless a lower quality value is proven to yield a better result for smaller files, or time constraints are set.
bzip2
or xz
should only be considered for compatibility purposes.
Font
As practically all modern browsers support the WOFF2 font format, all required TrueType and OpenType fonts must be served as WOFF2 files instead. If for unspecified reasons that original files must be served, always consider precompression and avoid storing uncompressed files.