[Resolved] CLS issue: more than 0.25 (mobile) using WProcket + Bunny CDN

Home Forums Support [Resolved] CLS issue: more than 0.25 (mobile) using WProcket + Bunny CDN

Home Forums Support CLS issue: more than 0.25 (mobile) using WProcket + Bunny CDN

  • This topic has 15 replies, 3 voices, and was last updated 1 year ago by David.
Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • #1578031
    Prajwal

    Hi @david,

    Been Generatepress user for over a year now, absolutely love it.
    But recently, I have installed Wprocket and Bunny CDN I suspect the issue started after this.

    Even though the speed score is pretty good 88+ for mobile and 95+ for DEsktop,I cannot get rid of the CLS issue on mobile(80+ poor URLS), desktop has no poor URL but URLs that need improvement. Since this will be a major ranking factor next year, I have been trying to get rid of it but cannot.

    Please Help, URL of a page with this error – https://bit.ly/348whwO

    I have disabled Critical CSS and disabled lazy loading on the Logo but has not changed anything.

    #1578045
    David
    Staff
    Customer Support

    Hi there,

    your logo is still being lazyloaded.
    The Snippet i provided here should fix that:

    https://generatepress.com/forums/topic/cls-issue/page/2/#post-1570242

    If that isn’t working then explain how you added the code.

    #1578047
    Prajwal

    Hi david,

    i added the code as a new snippet and select the option “Run script everywhere”
    and saved it. Cleared the cash.

    #1579441
    Prajwal

    @david Any suggestions ?

    #1579726
    David
    Staff
    Customer Support

    Can you temporarily disable the lazy load option so i can see if the lazyload is being removed, as currently it is not.

    #1581014
    Prajwal

    @david, i have disabled lazy load option for images. I have cleared cache on wprocket and the CND side of things too.

    Not sure what else can be done?

    #1581399
    David
    Staff
    Customer Support

    Ok so WP Rocket provide other snippets for excluding certain images on Lazy Load:

    https://docs.wp-rocket.me/article/15-disabling-lazy-load-on-specific-images

    Try: Example 2: Exclude an image based on its filename

    #1582468
    Prajwal

    @david, thats awesome. I cannot see the CLS issue listed while doing a google page insights. Lets see if they will get validated though. But getting the Does not use passive listeners to improve scrolling performance issue, which, after going through the forum looks normal. But did not have this issue before.

    Lets see. Thank you for your time. Is there anything else I should be checking? Also should I leave the critical CSS off?

    #1588828
    Prajwal

    @david Actually it does not look it has done much. https://snipboard.io/ub5MXz.jpg

    Any ideas if we can solve these? as the no.of URLS facing this issue is increasing and it might hurt the SEO moving into next year with google updates.

    #1589075
    David
    Staff
    Customer Support

    I just ran a page speed test on the Site – if you look under the Lab Data you will now see the CLS is 0 – which means the site no longer has a CLS isse. The Origin Summary data is based upon the last 28 days of collected data. Over the next 28 days you will see that information should update.

    Critical CSS – unless you know how to manually write your Critical CSS i would NOT use that feature. It will cause more problems then it solves.

    #1825979
    Prajwal

    Hi @david, this fixed my issue last time! I upgraded my server to a dedicated server (Cloudways) and I was able to achieve fantastic results! From last week I can see the lab data is showing FCP issue 1.9s i have not made any changes though!
    Please help me out again!

    https://bit.ly/348whwO

    #1826062
    Elvin
    Staff
    Customer Support

    Hi Prajwal,

    At this point, Critical CSS may be necessary.

    But you’ll have to catch which ones should be added. You can refer to Google’s guide on identifying which ones are critical
    https://web.dev/render-blocking-resources/#how-to-identify-critical-resources

    Here’s a real good read about this – https://wp-rocket.me/blog/improving-first-contentful-paint/

    A wise man once said:
    "Have you cleared your cache?"

    #1826207
    Prajwal

    I am pretty sure, Generate press and WProcket + critical css enabled creates issues! Correct me if I am wrong!

    #1826337
    David
    Staff
    Customer Support

    The issue isn’t related to GP. Its what the automatic Optimized CSS Delivery (Critical CSS ) function is doing. Using the automated option whatever theme can lead to issues. This is why people specialise in manually configuring Critical CSS as its impossible for an automated function to get it right for anything more than the very basic of sites ( when it probably isn’t necessary ).
    I just checked WP Rockets own website as in the past i noticed that their very own functions was causing CLS and broken layouts…. today those issues are fixed and oddly they are NOT using their own Critical CSS function… just the Unused CSS option… go figure 🙂

    #1830495
    Prajwal

    Thanks David! All Sorted, got another issue but will raise another request!

Viewing 15 posts - 1 through 15 (of 16 total)
  • You must be logged in to reply to this topic.