A modal interferes with LCP

[Tuvestad]

Hi,

A modal interferes with LCP in Pagespeed Insights despite being far down the page. Especially in mobile mode. If you reload the page in, for example, an iPhone, you can see the modal in expanded mode for a tenth of a second.

Have used that solution with modal before but then it has not affected LCP. But behaves the same way in my iPhone.

I’ve searched the forum but can’t find anything on this topic.

[tristup]

Hi @Tuvestad,

Thanks for reaching out.
Unfortunately, we didn’t face such an issue, and it had never been reported before. I would suggest you please share the URL where you are facing the problem, so we can investigate it.

Thanks

[Tuvestad]

Hi.

Here is the link to the website, https://brfpoolkanten.se/
You can see it most clearly when you refresh the page on a mobile phone

Thanks

[tristup]

Hi @Tuvestad,

I have investigated the URL in my Android mobile and as well as in the iPhone in the online testing tools, but am unable to replicate the issue described here. Can you please provide any screenshots marked with the issue or any video that helps us to recognize the problem?
We may also need to investigate it through the WordPress admin dashboard, please provide login credentials for your site in a secure note, including:

– WordPress Site URL & Login URL
– WordPress Admin username/password

To create a secure note, click the key icon underneath any of your posts.

Thanks

[Tuvestad]

Hi,

Here is a screenshot from PageSpeed ​​Insights.
And a screen recording from my iPhone.

Thanks for the help

[charlie]

What I’ve noticed on your site is that because of the litespeed CSS being loaded as async, when you initially load your page none of our off canvas CSS is loaded prior to the page being rendered. As a result we have this moment where the off canvas is visible and then immediately gets hidden. You can try the Dynamic Rendering toggle in the off canvas element and see if that helps. If it doesn’t you might have to try to ignore the integrity CSS file. Let us know if this helps.

[Tuvestad]

Thanks for the help!
Dynamic Rendering solved the problem.

[marc_a]

Hey @Tuvestad,

You’re most welcome!