Cumulative Layout Shift (CLS) on Mobile Post

  • Resolved colin

    (@scot184)


    1 year, 9 months ago

    Hi,

    There are four elements that are contributing most to the CLS of my page:

    <div class="nv-thumb-wrap">

<div class="nv-content-wrap entry-content">

<ul class="nv-meta-list">

<p>

      These are listed in order of CLS Contribution. Total is 0.282.

      This applies to an individual mobile post and seems to pertain to the featured image, the author/category/date above it, along with the first and second paragraphs of the article.

      Any possible fix?

      Thank you!

    Viewing 9 replies - 1 through 9 (of 9 total)
    • Thread Starter colin

      (@scot184)

      It doesn’t seem to apply to WordPress pages, which do not have a featured image, category, comment, or date byline. So it seems I need to adjust something with posts in Neve? Thank you.

      • This reply was modified 1 year, 9 months ago by colin.
      Kush

      (@kushnamdev)

      Hey @scot184

      Thanks for using Neve and reaching out.

      Can you please provide the url of your site so that we can have a close look at the CLS score and help you out?

      Thanks and regards.

      Thread Starter colin

      (@scot184)

      Hi Kush, it’s for this site.

      Thank you for your help!

      Hi @scot184!

      I checked your site and ran a Lighthouse report and the CLS score is 0 – screenshot. Also, the Performance score is 100%, so I’m not sure I can see the issue you’re referring to.

      Thanks!

      Thread Starter colin

      (@scot184)

      Hi Lucia,

      Thank you for taking a look. I should have specified that this is a mobile issue (desktop seems to receive excellent scores). Mobile gets horrible scores. To that end, do I need to enable “mobile cache” on my host even though Neve theme is responsive?

      Cheers!

      Colin

      AC

      (@purplecodes)

      Themeisle Support

      Hi @scot184,

      I did the performance test in Lighthouse on your mobile site.
      https://vertis.d.pr/v/iySkMB
      It was all green including the CLS.

      Kindly confirm if this is still an issue.

      Thread Starter colin

      (@scot184)

      Hi AC,

      I appreciate you taking the time to run that report, but these issues happen on individual posts, not the homepage.

      As noted in my original message:

      “This applies to an individual mobile post and seems to pertain to the featured image, the author/category/date above it, along with the first and second paragraphs of the article.”

      So the Lighthouse report has to be for mobile AND for an individual post (not the homepage). That’s where I saw the CLS issues.

      Thank you.

      Hi @scot184,

      I ran the LightHouse report on a single post layout for Mobile and the CLS is 0 – https://vertis.d.pr/i/ObKToJ. This is the URL where I checked it. In case I misunderstood the type of page where the problem happens, please share an URL where I can test again.

      As for the other aspects that don’t get high scores on mobile devices, you can check our dedicated article on how to improve the site performance and even try AMP for the post layout(doc here).

      I hope this will help.

      Thread Starter colin

      (@scot184)

      Thanks Stefan – good to see a CLS of 0. It seems to fluctuate from test to test, but perhaps is due to other issues (maybe font loads, third party stuff, etc.) that result in the theme shifting. I will try to improve other aspects of the page load to avoid any theme-related shifts.

    Viewing 9 replies - 1 through 9 (of 9 total)
    • The topic ‘Cumulative Layout Shift (CLS) on Mobile Post’ is closed to new replies.