• Hello,

    I am getting Largest Contentful Paint element of 3,680 ms for the below for one of your starter templates How can we resolve this?

    DELIVERY DRIVE-THRU PICKUP

    <h1 class=”kt-adv-heading2063_f9c94d-ac wp-block-kadence-advancedheading” data-kb-block=”kb-adv-heading2063_f9c94d-ac”>

Viewing 8 replies - 1 through 8 (of 8 total)
  • Hi there,

    Glad you reached out, happy to help.

    Are you referring to the Gourmet Burger starter template?

    I noticed the Largest Contentful Paint element is for the H1 on mobile view.?

    To resolve this:
    1. ?Enable “Load Google Fonts Locally” in the theme?Customizer > General > Performance.?Here is a screencast for your reference:
    https://share.zight.com/QwuoPK07

    2. Reduce the font size on mobile view

    Here is our blog post on how to speed up your website:
    https://www.kadencewp.com/blog/need-for-speed/
    ?
    I hope this helps. Please let us know how we can help further.
    ?
    Cheers,
    Eze

    Thread Starter eddyferns

    (@eddyferns)

    Hi Eze,

    Thank you for your reply.

    It is the mobile view of the Gourmet Burger template. Sorry I didn’t know the name.

    Have enabled the options as suggested. As a result the movement of the the H1 text from bottom to top has stopped when page loading.

    However the LCP still persists at 2780ms. Sharing with you screenshots of the Google PageSpeed insights with regards to LCP, speed index and eliminate render-blocking resources that needs to be addressed:

    https://pasteboard.co/WVUCoRJtygfk.png

    https://pasteboard.co/tezkWkNjK0lP.png

    https://pasteboard.co/3xw34LQsL1p5.png

    Regards,

    Ed

    • This reply was modified 3 months, 2 weeks ago by eddyferns.
    • This reply was modified 3 months, 2 weeks ago by eddyferns.
    karlalevelup

    (@karlalevelup)

    Hi, Ed!

    Apologies for the delay in getting back to you.

    There are a lot of possible causes why LCP is high. Could you give us your website page URL so we can better have insights?

    Thread Starter eddyferns

    (@eddyferns)

    Hello Karla,

    Thank you for your response.

    Website – https://kryptomania.xyz/

    Just to let you know the theme and its template is installed as is. No modification of any sort has been made.

    Best regards,

    Ed

    karlalevelup

    (@karlalevelup)

    Hi, Ed!

    Thanks for the link.

    I tested both your website and saw that the issue is only on mobile: https://pagespeed.web.dev/analysis/https-kryptomania-xyz/fgod49zbde?form_factor=desktop

    One way to improve the LCP score is to make resources of the page lighter. Do these steps:

    1. Edit your homepage.
    2. Click the Row Layout block where the hamburger background image was selected.
    3. Go to the mobile setting of the Row Layout block background and select a custom image.
    4. Reselect the burger image AND select a smaller image file size. Here’s a screenshot – https://share.zight.com/5zuodnkp

    I hope this helps and let me know if I can help you further.

    Thread Starter eddyferns

    (@eddyferns)

    Hello Karla,

    Thanks for the input.

    As mentioned previously it is the mobile matter.

    Selected a smaller image file size as per your screenshot. However the LCP score still remains high.

    Best regards,

    Ed

    Hi, Ed!

    I tested your page again and the LCP is not pointing to the image anymore. You should see here that it’s referring to the title – https://pagespeed.web.dev/analysis/https-kryptomania-xyz/am0q4qf6hy?form_factor=mobile

    LCP isn’t all about the LCP resource, the delay in its render/load is also attributed to the score. You can read more here –?https://web.dev/articles/optimize-lcp

    You should see that the Load Delay has the highest percentage – https://share.zight.com/5zuoBqKl. You can focus on this part of the documentation –?https://web.dev/articles/optimize-lcp#1_eliminate_resource_load_delay

    One way to improve LCP is to make sure that the resources are loaded quickly. You can try combining them into one file.

    Another opportunity is to load your images in next-gen formats like webP. If you do this, images will become lighter.

    I hope this helps, and let me know if I can help you further.

    Thread Starter eddyferns

    (@eddyferns)

    Hello Karla,

    Thank you once again for looking into the issue. You are very kind.

    The LCP wasn’t about the background image and that is why the LCP didn’t change despite reducing the image size.

    The earlier post that I replied to Eze, sharing the screenshot as below, has to do with the element of the H1 heading:
    https://pasteboard.co/WVUCoRJtygfk.png

    As this is the default Kadence template I thought it would be best to ask Kadence support if there is an option within the theme to sort it out.

    Nothing to worry as I am using the gourmet template for demo purposes only.

    Will see when time permits how to resolve this matter.

    Best regards,
    Ed

Viewing 8 replies - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.