Hi devs,
I see a lot more of us love images. The more beautiful and visually appealing they are, the more eye-catching they become.

Especially when we use stock images, we often overlook the size and file format, assuming that the browser will handle the bandwidth and rendering. However, this is not advisable, especially when building an application that will experience a significant amount of traffic in future.

I have noticed that many SaaS apps now keep their images in .webp format. This was new to me because we are all familiar with .jpg, .png, .svg, and .gif formats.

For example, a food delivery app will store all the dish images from restaurants in webP format, considering the large number of images that need to be loaded within the app.

Using the WebP format actually reduces the image size while maintaining the same resolution, resulting in better visual experience for the users.

How? Here's a helpful blog that explain the process and ways to convert images from .png or .jpeg to .webp.