Tidbits from Brian - Issue #44
Migrating our WordPress sites to AVIF images ⚡🗜️
We’ve been using WebP images on our sites for years now. It’s been a great image format (consistently smaller than JPG/PNG), and we haven’t had any issues using a fallback method (<picture> tag or rewrite) to the original images for browser support. However, I’ve personally been waiting for better AVIF support, and can say that now is a good time to consider it. I've just finished migrating our WordPress sites and thought it might be interesting to share a few thoughts and issues you might run into.
Main benefits of AVIF ⚡
The first benefit is obviously faster load times due to the smaller file sizes. This is mainly on images above the fold that aren’t lazy loaded (meaning a positive impact on your LCP in terms of Core Web Vitals). I took a few images from my migration to compare the differences. I am seeing, on average, a 29% decrease in image sizes moving from WebP to AVIF. 🔥
Image 1
PNG 56 KB
WebP 27 KB: ~52% decrease on PNG to WebP
AVIF 21 KB: ~22% decrease on WebP to AVIF, ~63% decrease on PNG to AVIF
Image 2
PNG 11 KB
WebP 10 KB: ~9% decrease on PNG to WebP
AVIF 7 KB: ~30% decrease on WebP to AVIF, ~36% decrease on PNG to AVIF
Image 3
PNG 42 KB
WebP 34 KB: ~19% decrease on PNG to WebP
AVIF 22 KB: ~35% decrease on WebP to AVIF, ~48% decrease on PNG to AVIF
Second, you should see increased crawl efficiency by Google and other tools due to the smaller file sizes and faster page rendering. 🤖
Can’t you just use AVIF images directly and skip the fallback?
In terms of browser support, it’s very similar now. WebP browser support is at ~95% while AVIF browser support is at ~93%. WordPress 6.5 and higher supports directly uploading AVIF images to the media library. However, ensure that your hosting provider has a newer version of ImageMagick running and the libavif library. Otherwise, you may encounter the following error. Most hosts shouldn’t have this issue.
Given the current state of support, you might think it would be better to just use AVIF images directly and save on disk space. The problem with that is social media (good post from Joost). For example, networks like X, LinkedIn, BlueSky, etc., don’t support AVIF yet. So if you want a preview image when sharing (which I personally do), you will still want to upload a WebP, PNG, or JPEG image. If you don’t care about this, you might be able to get away with it. 😅
What if you’re already using an image optimization plugin and using WebP?
It will likely vary slightly depending on what you are using and your approach. You could either enable AVIF and utilize WebP and PNG together, or revert back to your original backups (if you have them), and then do bulk optimizations again from the original images to AVIF. The latter is more time-consuming and perhaps more expensive, but would be smaller in terms of total disk space.
In my migrations, I actually decided to keep both WebP and AVIF. One reason is that I don’t know where I might have accidentally manually linked to a WebP image in a post, social meta tag, etc. This results in a little extra HTML on each page and disk space, but the gains from the image file reductions far outweigh that.
If you're curious, here's how much extra disk space was added, along with how long the bulk optimization took.
Site 1
Media library consisted of 627 images.
656 MB before, 679 MB after adding AVIF.
Bulk optimization took 45 minutes using Imagify.
Site 2
Media library consisted of 1252 images.
3.6 GB before, 3.64 GB after adding AVIF.
Bulk optimization took 1.5 hours using Imagify.
Site 3
Media library consisted of 4,141 images.
2.82 GB before, 2.88 GB after adding AVIF.
Bulk optimization took 2 hours using Imagify.
If you aren’t using AVIF images yet, it’s definitely something to consider if you want to shave off some additional weight across your WordPress sites. Hopefully, in a year or two, we’ll see social media catch up as well. It would be awesome if AVIF just worked everywhere.
Updates ✍️
We pushed out an update for our Perfmatters WordPress plugin. Here are a few of the changes:
New exclude leading option for lazy loading CSS background images. This allows you to more quickly and broadly target containers and then automatically exclude a hero CSS background image from lazy loading. ⚡
New speculative loading mode option to disable the feature entirely. 🚫 Mainly for slower shared hosting providers.
Reworked the critical_image_parent_exclusions and leading_image_parent_exclusions filters to no longer need to process the page HTML through DOMDocument for better stability, faster parsing, and 30% less code. 🔥
New lazyload_parent_exclusions filter allows you to add selectors for parent containers that you want to target and exclude any images they contain from lazy loading. 👨🔧
New css_background_selectors filter allows you to add CSS background selectors for containers for which you want to lazy load background images. 👨🔧
Fixed an issue with parent selector matching for fetch priority and lazy loading where only the first image tag would match if it was inside a nested container element.
Fixed an issue where the CSS background class would get added to child elements if they also contained a matching selector.
Fixed a compatibility issue when using Perfmatters preloads alongside WP Rocket.
Fixed a spacing issue with input row checkboxes in the plugin UI.
On June 19th, I'll be doing a website performance AMA! ⚡🚀 Got something you want to ask me? Submit your questions and sign up for the event here: https://theadminbar.com/events/website-performance-ama/
And a big thanks to Kyle Van Deusen for putting this together.
Interesting things 🔎
Misc.
Heads up, with Gemini now included in all business tiers, Google is increasing the price of Workspace plans in 2025. 💸
The social sharing app Pocket is shutting down. Some good alternatives in this post.
Watch this new Star Wars style speeder bike fly at almost 125 mph.
I’ve been using Sublime for over a decade! It’s the best lightweight text editor out there, in my opinion. Build 4200 was just released.
The Have I Been Pwned database/website from Troy Hunt got a complete makeover.
The CSS if() function landed in Chrome 137! This is pretty crazy. 🤓 We’ll have to see if other browsers also add support.
WordPress
A2 Hosting has rebranded and is now under the name hosting.com. Talk about an impressive domain name.
Happy 22nd birthday to WordPress! I still can’t believe I launched my first WordPress site 17 years ago. 😮👴
I use InstaWP on a daily basis. They just rolled out PHP 8.4 support, which will come in handy for testing.
Anil Agarwal, of BloggersPassion, has acquired our WP Coupons plugin. There is a free version now available on the WordPress repository.
Easy Digital Downloads version 3.3.8 includes new controls to customize checkout address fields. 🛒
Ollie Pro 2.0 is a huge update that brings a revamped Ollie dashboard and three powerful new site-building tools: the setup wizard, starter sites, and a child theme creator. I’ve played around with it, and it’s impressive!
FluentAffiliate is the newest WordPress affiliate plugin on the market from the team behind Fluent Forms.
Performance
Big changes are coming to PageSpeed Insights. Lighthouse is moving to performance insight audits. 😮🔥
ETA is October 2025. 🗓️
There is a switcher in the meantime to get used to things.
Some audits are being renamed while others are being removed.
Pascal built a CSS-only carousel block for WordPress (proof of concept). This is really cool, as it doesn't require any heavy JavaScript libraries.
Elementor releases the alpha of editor V4, its biggest overhaul in eight years. They are moving towards CSS-first styling with minimal JS for better performance.
Weston made a pull request to add low fetch priority to core modules and comments JS. This will be a great update to WordPress core.
Kinsta’s PHP Performance add-on is now available to everyone. And you can fine-tune the CDN, edge cache, and PHP behavior via the Kinsta API.
Great news! WooCommerce 9.9 will deliver massive admin performance gains. ⚡
“We’ve measured up to 95% reductions in page load times across critical admin screens." — Michael Pretty 😮
ETA is June 2nd.
Felix Arntz shares how Speculative Loading made it into WordPress core.
AI
WordPress has launched an AI team, focused on accelerating and coordinating artificial intelligence projects across the WordPress ecosystem. 🤖
The number of plugins submitted to the WordPress Repository has grown by 87% compared to last year, mostly thanks to AI.
Is AI killing the business model of the web? Search clicks fell 30% in the last year.
Are AI chatbots replacing search engines? An informative case study with lots of data.
Gael put out a great tweet about AI traffic using the new Cloudflare audit. Are the days of SEO officially over? As he said, the case for publishing free content on your website makes less and less sense. 🪦
Grok can now generate charts and graphs. 👏 In fact, I used it for the graph at the top of this newsletter. They also added the ability to draw sketches and use them in prompts.
Gemini 2.5 pro preview has been released. It has significantly improved capabilities for coding, especially building compelling interactive web apps.
Google also launched a lot of new features and updates at I/O 2025.
The Tesla Optimus robot has come a pretty far way in a short amount of time! Check out this comparison of 2022 versus 2025.
Claude Opus 4 and Claude Sonnet 4 were released.
If you're in the Scottsdale, AZ area, hit me up, and we can grab lunch! 🥗👋