Add support for WebP format

[tobias-kuendig]

• Allow WebP images to be resized (currently only jpg, gif, png are allowed)
• Generate WebP images along other formats

[mauserrifle]

I've created WebP generating support in this branch:
https://github.com/Qballinternet/oc-responsive-images-plugin/tree/qball-webp

It's stable and used by a production website. See the HTML output at https://2th.nl/en

I've chosen to only do the point "Generate WebP images along other formats" for now, because users will always need to upload jpg/png's. It's 100% supported by all browsers. The webp is then generated from the resized jpg/png images. So the user of a site does not need technical knowledge and the website is always optimized.

I'm mentioning this here instead of a pull request because the code needs to be made configurable using the backend and it should ignore existing optimizations (img tags enclosed by picture tags). So there is some work left to do.

A general note: please note that the jpegs can always still be optimized like 30-70% using tools such as mozjpeg. Currently I'm running a script every night over the storage/temp/public folder. Even the webp versions can be much smaller when generated again using optimized jpegs. My production site was 1.7MB after using the webp branch. After extra optimization by mozjpeg and cwebp, it went to 850KB. Thus to really make this plugin extremely optimized I recommend creating a todo issue for an option that does this optimization with PHP after the initial resizing.

[tobias-kuendig]

Support for WebP images has landed in 2.2.0! 🎉

[mauserrifle]

Awsome. Great work! I will be testing it soon in a project. I see you use a much better solution then I created and regretted. From the first looks you are serving all jpg urls as webp which is better. It might be worth looking into the wordpress webp express plugin. It has a method using a .htaccess file that serves webp just using a apache2 rule. No php involved (thus static file) unless webp is missing, then php is called.

Thanks for the support!

[tobias-kuendig]

We could check the header and the existence of the WebP file in the .htaccess:

https://github.com/vincentorback/WebP-images-with-htaccess

[tobias-kuendig]

Done in 2.2.1. Thanks for your feedback, @mauserrifle!

[mauserrifle]

That is so cool! Big thanks for all your efforts in your plugins. They are very helpful and you create an awsome base for projects. I hope I can contribute more in the future with actual production code. I was not happy with my webp implementation and lacked time to fix. I will be using this update in a project next week. Yay!