How to not generate webp when it's larger in size from the origional jpg

[Abdoo-mayhob]

I'll start by saying what a great plugin, I just discovered it, and it seems that I'll be having a lot of fun with it.

When I upload a new image, everything runs as expected, but in some images in some sizes (thumbnail for example) the generated webp file is larger in size than the original thumbnail file.

Does the plugin handle this situation at all or maybe I missed a setting somewhere?

I could provide examples and my settings and theme setup, but it would be extensive and a bit out of topic, if not specifically requested.

Thank you.

[ddur]

Usually WebP clones have much smaller file-sizes, you have an exception.

If your image is JPEG, for converting JPEG images to WebP, you have two choices:

1. use WebP compression quality equal to settings for JPEG image compression quality (default 60% which you can modify). So, lower the JPEG image compression quality results in lower WebP image compression quality settings. Choice 1) is meant to for most users to automatically fix cases where WebP image has larger file-size than JPEG file-size, due to different WebP compression quality (default 75%) than JPEG compression quality (default 60%). Using that settings is supposed to let user to try various JPEG compression quality and not worry about synchronizing with WebP compression quality. Once you have found JPEG compression quality that fits your site requirements, you may switch to choice 2) and set WebP compression quality (higher, same or) lower than used JPEG compression quality.
2. use configured WebP compression quality (default 75%, which you can modify) to be (higher, same or) lower than used JPEG image compression quality settings.

Then regenerate thumbnails for that image and see if it helps.

Make sure to hard refresh the browser because previous WebP image can still be in the browser cache.

Please let me know if that helps and what you did.

[ddur]

Anyways, almost all WebP files/clones are substantially smaller than original images saving tens or hundreds of kilobytes and even megabytes, saving internet traffic time and speeding up your site. Your case may rarely happen in small thumbnails of specific hard-to-compress images. Equal JPEG and WebP compression quality % on different images and compression algorithms may not always produce smaller WebP file sizes. But that still can be fixed in Warp iMagick plugin by fine tuning configuration. However, any file-size difference at small thumbnails should be very low (in bytes) and should not affect page-speed/load-time in any measurable way.

[ddur]

@Abdoo-mayhob

If you disable Warp iMagick plugin, regenerate thumbnails again and compare sizes, you will realize that Warp iMagick JPEG compression is actually so powerful that in some cases does better job than WebP compression. 😁

[ddur]

@Abdoo-mayhob

Set all JPEG compression settings to WordPress Default values, and WebP compression settings to same as JPEG (1). Regenerate thumbnails and all WebP images will be smaller in file-size than JPEG (now larger). WebP conversion/compression algorithm actually does not perform always so well over some already high compressed and sharpened JPEG images.

In my test sample, with thumbnail 150x150 pixels and original:

1. WordPress Default settings has generated JPEG 17Kb (WebP 8KB), - WP blurred thumbnail
2. Warp iMagick Default settings generated JPEG 8KB (WebP 9KB),
3. Set JPEG quality to 75%, and disable sharpening: JPEG 8KB (WebP 7KB). - WP blurred thumbnail
4. Uploaded original without any optimization: JPEG 2MB (WebP 710KB)

Image tested above is in public domain from BurningWell.org
https://www.burningwell.org/gallery/index.php/Plants/flowers/dsc20050901_104314_4

Both file-sizes added (JPEG+WebP) in case 2) are about the same as only JPEG file-size in case 1).

Thumbnails in WordPress are slightly blurred because that helps JPEG (and WebP) compression to make files smaller. Images with a lot of details, sharp or sharpened are harder to compress. It looks like WebP compression has more difficulties with smaller, sharp and high compressed thumbnails (case 2&3). But WebP still achieves great results from larger JPEG images (case 4).

So, if JPEG/WebP file-size difference so much matters to you, find your optimal JPEG settings that will never generate WebP file-size larger than JPEG file-size. Anyways, if your site serves WebP clones, JPEG images actually don't have to be super compressed because JPEG images are served only to older WebP disabled browsers, and to fewer visitors.

Deleting WebP files/clones with file-size larger than JPEG file-size is not an option.

For at least four reasons:

1. Difference is negligible and you have options/choice to avoid it.
2. Missing WebP image may be used as a flag for on-demand WebP conversion.
3. If WebP image is missing, PageSpeed Insights and other online pagespeed tools may lower your page score and recommend you to use Next Gen Image formats 😁.
4. To find out if WebP clone is slightly larger than JPEG it still has to be converted and cloned first, then size compared and then optionally deleted. Waste of time for partial solution.

[ddur]

@Abdoo-mayhob

Thank you for asking.

[ddur]

I will try, if it is possible, to configure Apache not to serve WebP Clones larger than cloned JPEG images.

[ddur]

@Abdoo-mayhob

Next version will have more options to select WebP compression quality when cloning and converting JPEG to WebP images.

1. JPEG settings - 15%
2. JPEG settings - 10%
3. JPEG settings - 5%
4. JPEG settings (default *)
5. WebP settings

Sites subscribed to plugin updates will be first to get next version when released.

[ddur]

@Abdoo-mayhob

I'll start by saying what a great plugin, I just discovered it, and it seems that I'll be having a lot of fun with it.

When I upload a new image, everything runs as expected, but in some images in some sizes (thumbnail for example) the generated webp file is larger in size than the original thumbnail file.

Does the plugin handle this situation at all or maybe I missed a setting somewhere?

I could provide examples and my settings and theme setup, but it would be extensive and a bit out of topic, if not specifically requested.

Thank you.

You may find some useful settings of JPEG to WebP compression quality in version 1.10.3

[ddur]

@Abdoo-mayhob

Yet another way:

If you replace

LINE

	RewriteCond %{DOCUMENT_ROOT}%1\.%2.webp -f

WITH

	RewriteCond %{DOCUMENT_ROOT}%1\.%2 -f
	RewriteCond %{DOCUMENT_ROOT}%1\.%2.webp -f
	RewriteCond expr "filesize('%{DOCUMENT_ROOT}%1\.%2') gt filesize('%{DOCUMENT_ROOT}%1\.%2.webp')"

YOU WILL GET YOUR SERVER CONFIGURED TO SKIP SERVING WebP CLONES LARGER THAN JPEG ORIGINALS.

# BEGIN Warp-iMagick - First line of .htaccess file.
# Transparently serve WebP images instead of JPEG/PNG to WebP enabled browsers.
<IfModule mod_mime.c>
	AddType image/webp .webp
</IfModule>
<ifModule mod_rewrite.c>
	RewriteEngine On
	RewriteBase /
	RewriteCond %{HTTP_ACCEPT} image/webp
	RewriteCond %{REQUEST_URI} (?i)(.*)\.(jpe?g|png)$
	RewriteCond %{DOCUMENT_ROOT}%1\.%2 -f
	RewriteCond %{DOCUMENT_ROOT}%1\.%2.webp -f
	RewriteCond expr "filesize('%{DOCUMENT_ROOT}%1\.%2') gt filesize('%{DOCUMENT_ROOT}%1\.%2.webp')"
	RewriteRule .+ %1\.%2\.webp [T=image/webp,E=webp:1,L]
	<IfModule mod_headers.c>
		Header append Vary Accept env=REDIRECT_webp
	</IfModule>
</IfModule>
# END Warp-iMagick

INSTEAD OF DEFAULT APACHE CONFIGURATION BLOCK

# BEGIN Warp-iMagick - First line of .htaccess file.
# Transparently serve WebP images instead of JPEG/PNG to WebP enabled browsers.
<IfModule mod_mime.c>
	AddType image/webp .webp
</IfModule>
<ifModule mod_rewrite.c>
	RewriteEngine On
	RewriteBase /
	RewriteCond %{HTTP_ACCEPT} image/webp
	RewriteCond %{REQUEST_URI} (?i)(.*)\.(jpe?g|png)$
	RewriteCond %{DOCUMENT_ROOT}%1\.%2.webp -f
	RewriteRule .+ %1\.%2\.webp [T=image/webp,E=webp:1,L]
	<IfModule mod_headers.c>
		Header append Vary Accept env=REDIRECT_webp
	</IfModule>
</IfModule>
# END Warp-iMagick

[ddur]

Hi @Abdoo-mayhob

Have you tried or decided to use modified Apache rules (above)?