WebP is a modern image format that provides superior lossless and lossy compression for images on the web. Using WebP, webmasters and web developers can create smaller, richer images that make the web faster.
How to use ?
For compress your jpg and png to webp formate is very easy just follow this step.
1. Insert your new images to folder src/img/your-folder/
2. Running gulp images
in terminal, npm tools will running to compress your images
3. After compress complete, call your images source from dist/img/your-folder/
Yeahh, your site now use optimized images
Note: WebP formate maybe can't open from your desktop app, but running fine in modern web browser. For information browser supported read in here
Why must WebP ?
WebP lossless images are 26% smaller in size compared to PNGs. WebP lossy images are 25-34% smaller than comparable JPEG images at equivalent SSIM quality index. more information in here WebP Images and in Wikipedia in here