jscher2000 / Save-webP-as-extension

Firefox extension to overlay format and JPEG quality buttons on inline or stand-alone images for quickly saving a converted version of the image.
Mozilla Public License 2.0
43 stars 1 forks source link

[Question] Why is there a signicant file size difference between your conversion method and letting FFmpeg do it? #28

Open nicolaasjan opened 9 months ago

nicolaasjan commented 9 months ago

Example image (21.6KB). When saving the .webp image with your extension as .jpg (100%), the the file size will be 194.1KB (Linux, ext4). When converting using FFmpeg the the file size will be 62.8KB. Is that because Firefox uses the canvas?

Linux FFmpeg command to save in best quality: for i in *.webp; do ffmpeg -i "${i}" -qmin 1 -q:v 1 -bsf:v mjpeg2jpeg "${i%.webp}.jpg"; done

jscher2000 commented 9 months ago

Interesting. Do PNG images come out the same size?

What this add-on does is create a canvas, draw the target image onto the canvas, extract a blob from the canvas, then download the blob in your selected format. You can see this on lines 192-217:

https://github.com/jscher2000/Save-webP-as-extension/blob/master/fmtbtns.js#L192

So somewhere in that process, there is a difference from ffmpeg, but I couldn't tell you where or what it is. Even if I could, since I'm just using the built-in facilities Firefox provides, I don't have any control over its compression algorithm.

nicolaasjan commented 9 months ago

Do PNG images come out the same size?

With the extension: 285.6KB With FFmpeg: 276KB (FFmpeg command: for i in *.webp; do ffmpeg -i "${i}" "${i%.webp}.png"; done) So less difference here.

I don see a noticeable difference in quality, when looking at the jpg's at 500% enlarged: Firefox processed: screenshot1

FFmpeg processed: screenshot2

Image info. Firefox processed:

Schermafdruk op 2024-01-05-1

FFmpeg processed:

Schermafdruk op 2024-01-05-2

So, there is a difference in print size and resolution (this is not the case with the png's) Note, that I'm not an expert in this field. 😀️