Unable to fix Core Web Vitals

Hi there,

When I loaded your site it loaded the HTML without any styling for a second, and then the CSS kicked in. This will cause all kinds of CLS issues.

My guess is that's it's your caching plugin doing this. What does your CLS look like if you temporarily disable it?

When using a caching plugin, make sure all CSS files are still loading in the header (not the footer).

Cache uninstalled.
Mobile data: https://imgur.com/sMi8T67
Desktop data: https://imgur.com/phZgM4T

I'm still seeing the same issue. I'm also seeing this in the HTML source: https://www.screencast.com/t/fomPxh8z

okay check now.

The main issue here is the Page Hero with WP Show Posts in it. However, what's happening on your site isn't the default behavior, as we can see on the site where that Page Hero comes from: https://gpsites.co/dispatch/

There is still something minifying your HTML if you view the source. We're not able to really look at what's going on while caching/minifying is in place. Can you make sure all caching/minifying plugins and services are disabled while we look at this?

Done please check.

Hi there,

There's a lot to tackle here. I'd personally start with "Reduce initial server response time".

Your server is too slow to respond. All other things rely on this. If the server response is slow, it makes sense if all the other asset loads are delayed.

Consider running the site on a known fast/high-quality server.

Next is, I'll try disabling a CDN that servers your stylesheets. It doesn't look reliable. It's loading things too slow.

See this waterfall - https://share.getcloudapp.com/L1udEjnv

380ms - 500ms is too slow.

I'd also suggest disabling Lazy load for the WPSP images to address CLS. Your WPSP images are above the fold. It's not ideal to use lazyloading on images above the fold.

"It’s not ideal to use lazyloading on images above the fold." Can i do it using any plugin?

“It’s not ideal to use lazyloading on images above the fold.” Can i do it using any plugin?

Lazyloading plugins generally have a way to exclude images from lazy load.

I'm not exactly sure what your site uses so you'll have to check it yourself. Once you've identify the plugin, go to its site and check its documentation about lazy loading and exemptions.

Okay I did some changes can you check if its working or not and also the CLS, LCP

Images above the fold seem to lazyload even now.

Check your Jetpack plugin settings.

Also: This has to be addressed - https://share.getcloudapp.com/mXupNL0o

Everything is affected by this. 3s for server response is just too slow.

Consider migrating to a better quality server.

migrated the servers to my nearest location. Okay asking the hosting provider about the issue.

migrated the servers to my nearest location.

That's not necessarily the best thing to check. Proximity to your location doesn't mean good quality.

You just need a server that responds faster than this. It can be from anywhere.

Okay asking the hosting provider about the issue.

Goodluck. Let us know how it goes.