[Support request] LCP on Mobile jumped to 4.2s; any suggestions to reduce this?

[Andrew]

I’m using Autoptimize with lazy loading enabled. Images are all as small as I can get them using multiple online image compressors. Anything else I can do to make it faster? (Note GT Metrix from a Vancouver server using Chrome says LCP is 2s.)

Google is only reporting errors with mobile; on desktop it’s moderate. Don’t seem to be able to hit Good for any blog pages. I can settle for Google to be moderately happy, but prefer not to see any errors.

Note, this could also wash out itself – it continually reports a small number (<5) of Mobile Usability issues, which fix themselves – basically the error moves from page A to page B to page C, etc. An issue with Google and not the site I believe (the pages always pass the live test).

I was testing this page: https://tarsolutions.co.uk/blog/dates-in-tableau-the-ultimate-guide/

[David]

Hi there,

thats a fun one to diagnose.
So looking at various reports there is very little difference between FCP and LCP. First off any improvements to FCP will flow down to LCP.
The fact that both FCP and LCP are the same / very close – means that all render blocking resources and other code is being loaded up front. Looks like you’re using Rocket loader to do that.
May be better off seeing if there is any resources that can be deferred so they are not in the critical render path.

[Andrew]

Interesting, you’re right, FCP and LCP are very similar. I’ve taken a look at the render blocking resources:

1. Google fonts are loading from an API (I think)
2. Autoptimize css (which seems to be the biggest)
3. Mailchimp

Interesting, the autoptimize css, as well as appearing in the render blocking resources, also appears in Remove Unused CSS.

Note I’m not using Rocket Loader. Using Cloudflare CDN and Autoptimize plugin. Also using a wordpress cloudflare plugin, “super page cache”.

[David]

1. Google fonts are coming from their servers. Reducing the number of fonts or deselecting the unused variants ( https://docs.generatepress.com/article/google-font-variants/ ) could reduce the number of requests.

2. Autoptimize is combining all your CSS…. you may want to test uncombined to see what difference it actually makes.

3. Mailchimp is another 3rd party request…. might be worth googling to see if its performance can be improved or any CSS / JS be loaded in the footer as your Form is not above the fold.

Rocket Loader is the script cloudflare uses for serving up requests. Theres a possibility that the CDN hasn’t fully propagated and therefore on initial load of a page you’re getting slower times.

[Andrew]

I reduced the google fonts and tested a few combinations of Autoptimze CSS. All giving pretty much the same results. I haven’t touched cloudflare for months, so wouldn’t expect any issue there (but not saying it isn’t).

I’ll leave it overnight and see if it washes out

[Author]

Posts