Updating Images from PNG to WebP

[GeekBoySupreme]

🚀 Feature

Updating to WebP images instead of PNG

Have you read the Contributing Guidelines on issues?

Yes

Motivation

To improve the Lighthouse Score of Docusaurus, updating the images would lead to significant performance gains.

Pitch

WebP is a lighter image format that retains image qualities but helps to reduce the memory footprint. Smaller file size ensures less time for the page to load, thereby allowing faster performance benchmark in Lighthouse. Updating this one Image updated the lighthouse Score from 73 to 78.

[JoelLau]

hi, can i pick this up as part of hacktoberfest? i intend to convert all files to webp using tools such as https://github.com/hoipo/webp-converter-cli

[slorber]

Hi

Docusaurus may have some pngs on its site but it's not a big deal, and users can use webp on their site if they want.

We also have process for resizing images and lambda to take showcase screenshots automatically

I'd prefer if we manage this ourselves instead of delegating to the community.

Also we may directly want to try using av1 as well in srcset if we want something optional

This issue is vague and has no clearly defined scope (ie which images exactly) so I'm just going to close. Please assume that we continuously optimize our own website and it's not really needed to suggest us to optimize more

[Josh-Cena]

The main issue we hit was that ideal-image does not support webp, or we would have converted them long ago. It's still on my todolist, though.

[PreventRansomware]

Would love to get this one done please! webp images are not working in my build

[JerryI]

When it comes to animated pictures, webp is the only format in 2024, which gives decent quality/size.