skip to Main Content
<html>

<head>
  ...
</head>

<body>
  --- it looks like
  <div>
    <canvas /> <-- only here without another leaf
  </div>
  --- or
  <canvas /> <-- only here without another leaf
  ---
</body>

<html>

I tried to add another leaf element and Lighthouse works well. But, I’m facing scale problem on canvas element that not have render behavior like div I just want my single canvas display on my website. So, I asking for another approach to fix that problem without add another leaf element.

2

Answers


  1. your code should be

    <head>
    ...
    </head>
    
    <body>
    <div>
      <canvas>
    
      <canvas />
    </div>
    --- or
    <canvas>
    
    <canvas /> <-- only here without another leaf
    ---
    </body>
    
    <html>
    
    Login or Signup to reply.
  2. Currently canvas elements are not eligible as LCP elements. Therefore if your page consists of only this, then no LCP element will be captured.

    You can track the request for this here:
    https://github.com/w3c/largest-contentful-paint/issues/74

    There’s also a suggestion to improve the Lighthouse error message in this case here:
    https://github.com/GoogleChrome/lighthouse/issues/12309

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search