Optimizing your site for core web vitals was a piece of cake even for sites using all types of ads.
I always got away with it and passed CWV reports until Interaction to Next Paint (INP) became a new metric.
All INP issues my sites were getting have to do with the mobile experience. Desktop has never been an issue.
According to Google Search Console, I was getting 212 ms on Mobile (Group INP) and that should be less than 200ms if I want my sites to pass Core Web Vitals Now.
At first, I said to myself that I wasn’t fixing sh*t but then I thought that I should if that’s a tiny SEO factor or something.
I thought that fixing a tiny thing here and there would solve the speed issue but the task became more difficult that I anticipated.
After applying several changes, I was able to pass Core Web Vitals on Mobile
Table of Contents
What Have I Done So Far
I use a few plugins and services to keep everything as easy and light as possible.
The services I use are:
| #1 | CloudFlare |
| #2 | Digital Ocean via Cloudways |
I did quite a few things these past few days to optimize my site using GeneratePress.
- I optimized the core block library at first but that inlined CSS at the footer so I removed it completely and wrote CSS for the WordPress Core Blocks I am using. I added that custom CSS to a custom external stylesheet.
- I stopped lazy loading ads with Ad Inserter Pro so I didn’t have to rely on Ad Inserter kinda heavy library. I still use Ad Inserter but not features that add any inline or external scripts.
- I delayed the execution of Google Adsense . At this point only 13 ads load on Desktop and 8 load on mobile. I also added the Adsense Script to the footer instead of the header.
- I also removed Google Ad Manager ads since these ads weren’t really beating Adsense.
- I removed an H5P style that was being loaded everywhere on the site despite not being needed on most pages and posts.
- I removed the GP Mobile Menu because I thought that a bunch of menu links on mobile wasn’t a good experience at all. Then I opted for creating a custom header and an overlay menu for both Desktop and Mobile
- I created a programmable search engine instead and added it to the overlay menu so I don’t have to deal with customizing search forms, the search-results page and no-search-results page. My site doesn’t load any scripts related to the GeneratePress search modal.
- I removed all GeneratePress stylesheets and enqueued a custom stylesheet that make everything look like it used to.
- The HTML of my sites hasn’t been any cleaner.
- I removed Local Google Fonts and started using Web Safe Fonts.
Finally I ended up with no more than 7 requests loading mostly everywhere on the site:
| Order | Request |
| #1 | HTML File |
| #2 | Custom Stylesheet |
| #3 | Scripts to Delay Scripts |
| #4 | Logo Image |
| #5 | Google Analytics (Delayed) |
| #6 | Adsense |
There are a few pages in which H5P styles and scripts are being loaded.
However all the scripts are being delayed and the styles don’t load before more important requests
These are the number of scripts and Styles added by H5P
| Order | Request |
| #7 | HP5 style #1 |
| #8 | HP5 style #2 |
| #9 | HP5 style #3 |
| #10 | H5P script #1 |
| #11 | H5P script #2 |
| #12 | H5P script #3 |
| #13 | H5P script #4 |
| #14 | H5P script #5 |
| #15 | H5P script #6 |
| #16 | H5P script #7 |
| #17 | H5P script #8 |
| #18 | H5P script #9 |
Are Ads the Real Problem?
I wanted to do my best to optimize the site and see if those other issues could fix the problem.
Also:
- I didn’t really like the idea of delaying ads for Desktop and Mobile users because Desktop is just simply fine.
- Debug Bear kept telling that the possible problem could be related to an (1) menu icon, (2) search Icons (3) buttons
Perfmatters provided a guide indicating that ads could be the main reason why sites were experiencing INP issues:
We’ve seen a big correlation with high total blocking time (TBT) resulting in higher INP values. So sometimes it can help to track down the biggest contributors to TBT. Many sites that are running ad networks like Google Adsense, Raptive (AdThrive), BlogHer, Mediavine, etc., typically have higher TBT. We recommend reaching out to them to see what they are doing to best optimize for INP.
How to optimize Interaction to Next Paint (INP) in WordPress
I don’t really know if delaying ads solved the issue or if it was the combination of several of the optimizations implemented over the past three months.
But It gotta be the ads when you have a super lightweight theme not loading any scripts and whose CSS have been extremely purified.
According to Google Page Speed Insights, I barely got it below 200ms
Hopefully I won’t deal with these type of speed issues again.
INP Issues Rematch – 2025
The other day I was checking Google Search Console for SEO errors and found that the site I already optimized was experiencing INP issues again.
I don’t know what caused the problem
- Less traffic and that being from third world countries
- Site Migration
- Moving some critical CSS to an stylesheet hoping to have a cleaner HTML.
I don’t know.
Free tools like Debug Bear didn’t show me any issues so I had to optimize things hoping one of those optimization would fix the problem.
Hosting Changed
First I stopped using Cloudways, then moved to Digital Ocean, turned my sites into static sites and ended up hosting them on CloudFlare Pages.
I didn’t change Hosting provider to deal with CWV issues.
Since I started to use CloudFlare Pages, I stopped using CloudFlare APO since these two CloudFlare services are not compatible with each other.
No More Plugins
When it comes to plugins, I got rid of all plugins.
How did I do that?
- You don’t need a plugin to create custom fields and custom post types. Default meta boxes look horrible but nothing that some custom code couldn’t handle.
- You don’t need caching if your site is 100% static.
- I am glad that I didn’t use GenerateBlocks on posts. Header, Hero and Footer are pure HTML and Vanilla CSS.
- I don’t need the CloudFlare plugin since my site is hosted on CloudFlare via CloudFlare Pages.
- I reduced the number of Adsense Ads and I insert these using a mu-plugin.
- I created my own mu-plugins to create all type of quizzes.
Glad that I don’t have to deal with plugins and updates anymore.
Custom Theme
I started using a child theme for GeneratePress and I kept making changes to it until one day, I removed the parent theme and the child theme became the parent theme.
Now I have full control of the theme, so Instead of using plugin, I create templates.
None of this wouldn’t have been possible without Artificial Intelligence.
What I have done so Far to Fix INP Issues?
These are some of the things I have been working on.
- I added critical CSS to the header, the rest of styles to the footer.
- I load some CSS dynamically on pages where they are necessary.
- I started using this script by Flying Scripts since it was lighter than the one by Perfmatters so I inlined it.
- I removed Google Analytics since I was using it at all.
The only two requests besides the Adsense Requests are the main HTML Files and the 1KB Favicon.
| Order | Request |
| #1 | HTML File |
| #2 | Favicon |
| #3 | Adsense Requests |
I started with a Group INP of 220 and it keeps going down as days pass.
At the moment of updating this post, it is at 208ms.
So hopefully it gets under 200ms in a week or so.
