Frage zur Konvertierung in das avif Format

[sandreas]

Hallo Zusammen,

ich hätte mal eine Frage zum Thema avif Format. Und zwar habe ich ein Original-Bild (out of camera jpeg) ein bisschen gecroppt und nun hat es die Abmessungen: 3872x2592

Daraus möchte ich via vipsthumbnail mehrere Thumbnails in der größe 235 (beim Einhalten der Ratio) für die Veröffentlichung auf meiner Homepage erstellen.

Nun stellt sich heraus, dass man je nach Browser-Unterstützung im besten Fall das Format avif und als Fallback noch ein webp sowie ein jpg erstellen kann.

Ich möchte gerne den avifenc nutzen (z.B. wie hier https://web.dev/compress-images-avif/). Allerdings unterstützt das Programm kein resize.

Jetzt meine Fragen:

• Wenn ich zuerst ein jpg in größe 235 erstelle und anschließend das avif daraus, ist die Qualität nicht schlechter als die vom jpg?
• Wenn ich zuerst ein lossless png erstelle und danach ein avif, wäre das nicht besser?
• Was wäre die einfachste und beste Vorgehensweise für diesen Fall?

 

[Amaoto]

Wenn ich zuerst ein jpg in größe 235 erstelle und anschließend das avif daraus, ist die Qualität nicht schlechter als die vom jpg?

Bei einer verlustbehafteten Kodierung wird die Qualität prinzipiell immer schlechter. Es kommt meistens darauf an, wie viel man davon sieht.

Wenn ich zuerst ein lossless png erstelle und danach ein avif, wäre das nicht besser?

Theoretisch ja. Allerdings ist es bei 200px Thumbnails wohl eher vernachlässigbar, genau wie die dann minimal geringere Größe der Dateien. Auf dem Server/Webspace kehrt sich das ja durch die notwendigen Fallbacks sogar ins Gegenteil um.

 

[sandreas]

Bei einer verlustbehafteten Kodierung wird die Qualität prinzipiell immer schlechter. Es kommt meistens darauf an, wie viel man davon sieht.

Das ist mir klar... was mir nicht klar ist: Warum unterstützt avifenc dann kein resize vom Original um diese Verluste zu minimieren?... das macht für mich überhaupt keinen Sinn, da ja immer noch ein zusätzlicher Encoding-Schritt notwendig wird, um ein verlustfreies Exemplar vorher zu erstellen und daraus dann das avif ODER die Qualität nicht dem entspricht, wie sie sein könnte.

Theoretisch ja. Allerdings ist es bei 200px Thumbnails wohl eher vernachlässigbar, genau wie die dann minimal geringere Größe der Dateien.

Für kleine Bilder mag das zum Teil stimmen. Aber ich brauche auch noch 512er und 672er. Es ist aber ein (für mich) immer noch sichtbarer Unterschied, ob ich von einem 235px lossless PNG oder 235px JPG ein avif erstelle (nur mal so).

Auf dem Server/Webspace kehrt sich das ja durch die notwendigen Fallbacks sogar ins Gegenteil um.

Da bin ich nicht so sicher.. insbesondere weil sich textbasiertes HTML ja durch gzip-encoding sehr gut komprimieren lässt und binäre Bilddaten eher nicht so. Vergleicht man avif mit anderen Formaten, spart man doch deutlich Bandbreite ein. Hier mal ein Auszug eines Test-Bildes (bei meinen anderen Bildern sieht es statistisch ähnlich aus)

# avif aus jpg 44kb
43701 Aug 16 11:55  wood-591631_672.avif
# jpg 65kb
65425 Aug 16 11:55  wood-591631_672.jpg
# avif aus png 49kb
48566 Aug 16 11:56  wood-591631_672_lossless.avif
# lossless png (630kb)
629519 Aug 16 11:55  wood-591631_672_lossless.png
# webp 62kb
62116 Aug 16 11:55  wood-591631_672.webp

Also spart man mit AVIF gegenüber dem sonst besten format webp in diesem Beispiel 13kb vom lossless PNG bei einer Größe von 672px.

Falls jemand meine Einstellungen interessieren, hier mal ein Teil-Dump der Konfiguration meiner eigens dafür geschriebenen Software:

{
    "vips_jpg": ["vipsthumbnail","{source}", "-s", "{size}","-f", "{destination}[optimize_coding,strip]","--eprofile", "/usr/share/color/icc/sRGB.icc", "--rotate", "--delete"],
    "vips": ["vipsthumbnail","{source}", "-s", "{size}","-f", "{destination}[strip]","--eprofile", "/usr/share/color/icc/sRGB.icc", "--rotate", "--delete"],
    "vips_lossless": ["vipsthumbnail","{source}", "-s", "{size}","-f", "{destination}[strip]","--eprofile", "/usr/share/color/icc/sRGB.icc", "--rotate", "--delete"],
    "cwebp": ["cwebp","-resize", "{size}", "0", "-q", "75", "{source}", "-o", "{destination}", "-quiet"],
    "avifenc": ["avifenc", "--jobs", "all", "--min", "0", "--max", "63", "--yuv", "420", "-a", "end-usage=q", "-a", "cq-level=28", "-a",  "tune=ssim", "--ignore-icc", "--speed", "0", "{source}", "{destination}"],
}

 

[Amaoto]

Warum unterstützt avifenc dann kein resize vom Original um diese Verluste zu minimieren?

Es ist die Unix-Philosophie, die in solchen FOSS-Projekten oft angewandt wird: "Do one thing and do it well". Der Encoder soll nur Kodieren. Wenn man es vorher skalieren möchte, kann man es entsprechend skripten oder einfach pipen und zwar genau mit dem Resizer, den man dafür haben möchte, gerade wenn du da diverse Auflösungen erstellen möchtest.
Wenn du ein einziges Tool für alles brauchst, kannst du z.B. ImageMagick nehmen:

convert image.png -resize '235x235' image.avif

(längste Seite 235px unter Beibehaltung des Seitenverhältnisses)

Also spart man mit AVIF gegenüber dem sonst besten format webp in diesem Beispiel 13kb vom lossless PNG bei einer Größe von 672px.

Ja, aber das sind einerseits keine 230px wie in der Frage und andererseits nicht auf dem Webserver wie in meiner Antwort.

 

[HITCHER_I]

Ich hab ein paar mal testweise cavif verwendet um aus PNG AVIF Dateien zu erstellen, war mit dem Ergebnis recht zufrieden.

cavif -i 05.png -o 05_4.avif --pix-fmt yuv444 --profile 2 --delta-q perceptual --cpu-used 0 --rate-control cq --qmin 0 --qmax 31  --adaptive-quantization variance --enable-row-mt --threads 12 --use-qm  --enable-full-color-range --bit-depth 12

https://github.com/link-u/cavif