Questions tagged [webp]

WebP is an open standard for image encoding. It is intended to provide support for animation, metadata, lossless compression, and transparency without the patent or license restrictions of existing formats.

WebP is a new image format that provides lossless and lossy compression for images on the web. WebP lossless images are 26% smaller in size compared to PNGs. WebP lossy images are 25-34% smaller in size compared to JPEG images at equivalent SSIM index. WebP supports lossless transparency (also known as alpha channel) with just 22% additional bytes. Transparency is also supported with lossy compression and typically provides 3x smaller file sizes compared to PNG when lossy compression is acceptable for the red/green/blue color channels.

754 questions
2
votes
1 answer

Safari 14 on Big Sur doesn't load webp and doesn't fallback to other provided sources

I have a picture element that was working on Safari 14 on Catalina. It uses two sources in a picture element. The first one is webp and the 2nd one is jpg. Safari, as it doesn't support webp, used to fallback to the jpg. In the new Big Sur OS it…
yhattav
  • 63
  • 6
2
votes
0 answers

Why is React loading failover img src if WebP is supported in Firefox?

My understanding is that given the following code, only the *.webp image should be loaded. ... But somehow,…
sunknudsen
  • 6,356
  • 3
  • 39
  • 76
2
votes
2 answers

How lazy load picture element in slick slider?

Ken Wheelers slick slider works great with normal pictures like jpeg. To improve loading performance i try to work with the picture element to have webp support with fallback. The data-lazy attribute works only with the img tag. Is there a solution…
harley81
  • 190
  • 2
  • 12
2
votes
2 answers

HTML picture element downloading wrong image on mobile

I'm running a page through Google's Page Speed Analyzer and for mobile, it's telling me I should download the proper size images. I know the viewport size, but I don't know the width of the slot because we are using a responsive layout. I've looked…
Fongers
  • 155
  • 1
  • 1
  • 9
2
votes
0 answers

Pagespeed insights penalty for srcset hiDPI images

I am using the srcset to offer high res images on displays with a high pixel density, using a srcset, like so;
larsvg
  • 21
  • 1
2
votes
2 answers

Animated not working when i convert Gif to webp in PHP

I convert animated gif to webp but the webp picture is not animated. Did I miss a step? I don't find in the documentation. my code: //GD $image = imagecreatefromgif("./mypics.gif"); imagepalettetotruecolor($image); imagewebp($image,…
Ludovic
  • 501
  • 5
  • 10
2
votes
1 answer

Adding Webp support to Revolution Slider

I want Revolution Slider to use webp images if there is any available but it has no support for webp. How can i make this work ?
Kitiara
  • 343
  • 6
  • 21
2
votes
0 answers

Django Convert All Webp Images In Template To Png/Jpg Just On Apple Safari Browsers

If using webp images by default in Django, how would you go about converting the webp images from the database to either png or jpg just on Apple Safari browsers while keeping the default webp for every other browser? Would Pillow be the way to do…
2
votes
2 answers

Why doesn't browser load webp images? (gatsby site, page generated from mdx)

I'm wondering if anyone can please help me determine why webp images are not rendered when viewing my gatsby site in the browser? i'm using gatsby-plugin-mdx and gatsby-remark-images with option withWebp: true With this setup, the resulting output…
Danoz
  • 977
  • 13
  • 24
2
votes
1 answer

Video to webp converter software

I need to convert several videos to animated webp format, but I found no software to handle it. There are some online tools, but they are either paid or work with restrictions like low resolution and fps.
Anton Bystrov
  • 134
  • 2
  • 10
2
votes
0 answers

Loading WebP image in ReactJS

I am trying to use WebP images in my react project which is: 1- Ejected (Yes it is very stupid of me-but i was very unexperienced) 2- Using webpack so I store images in assets/images where I have .png, .svg, .jpg, .jpeg and .webp extensions. This is…
2
votes
1 answer

How to convert JPEG to WebP format using .NET Core?

I have an ASP.NET Core 3.1 WebAPI that is responsible for providing other apps I have with images. I am trying to improve the performance of my apps. One of the feedback I get from running PageSpeed Insights test is to Serve images in next-gen…
user12310517
2
votes
1 answer

webp images not displaying using Angular 8, Chrome version 78

I cannot figure out why I cannot see webp images in my angular application. Below is the code:
Willie
  • 281
  • 3
  • 21
2
votes
0 answers

how to prevent blogger to increase thumbnail image size?

My blogger blog related Post widget codes are given below. I used webp image format in my post. But related Post's thumbnail image is converted to .jpg and size of image is also increased to nearly 10 times of same image