amp-htmlpagespeed

Largest Contentful Paint element

<li>
        <a href="/home/articles/how_to_foo">How to foo</a>
    </li>

PageSpeed Insights says the above element has Largest Contentful Paint element 3,220 ms enter image description here

TTFB 600 ms
Load Delay 0 ms
Load Time 0 ms
Render Delay 2,620 ms

Could anyone offer a tip on how to investigate this?

[Update 2025-04-10]

I followed the answer and could reproduce the LCP delay: enter image description here

[Update 2025-04-10] The page is a very simple AMP page. The only animation related code:

  <style amp-boilerplate>
        body {
            -webkit-animation: -amp-start 8s steps(1,end) 0s 1 normal both;
            -moz-animation: -amp-start 8s steps(1,end) 0s 1 normal both;
            -ms-animation: -amp-start 8s steps(1,end) 0s 1 normal both;
            animation: -amp-start 8s steps(1,end) 0s 1 normal both
        }
       ...
    </style>
    <noscript>
        <style amp-boilerplate>
            body {
                -webkit-animation: none;
                -moz-animation: none;
                -ms-animation: none;
                animation: none
            }
        </style>
    </noscript>
Solution

  • TTFB at 600 ms is quite slow—Google recommends keeping it under 200 ms.
    As for the Render Delay (2,620 ms), your input isn’t specific enough yet. I suggest using the Performance tab in Chrome DevTools to record a session and identify any scripts or rendering tasks that might be blocking the main thread.

    enter image description here

    Let me know what you find—happy to help dig deeper.