Speed up WordPress with WebP and AVIF

Images are often the heaviest part of a page. WebP and AVIF are modern formats that usually produce smaller files than JPG and PNG at similar visible quality. This tutorial shows how to roll them out safely.

What you need

• A WordPress site and a backup of your media library.
• The MeloTools Image Optimizer plugin.
• A page speed test tool you trust, for before and after checks.

Step 1: measure first

Run a page speed test on three key pages and note the page weight and Largest Contentful Paint. Save the results so you can compare later.

Step 2: pick formats

WebP has broad browser support and fast conversion. AVIF can give smaller files but takes longer to produce. Many sites use WebP first, then add AVIF once things are stable.

Step 3: test on a few images

1. Install the plugin.
2. Follow the quick start on a handful of images.
3. Compare quality at normal size and on a high-density screen.

Step 4: roll out to the library

When you are happy with the test, process the rest of your library. See How it works for what happens to originals and converted files.

Step 5: clear caches and re-test

Clear your site, server, and CDN caches. Run the same page speed tests as before and compare. Check images in a current browser.

Step 6: watch for problems

Look for blurry images, broken transparency, and missing images. If something looks wrong, see Troubleshooting.