Same Origin Third Party Scripts sameSite attributes sink lighthouse score. There must be some fix

graphcomment.com is not a bad commenting system, quicker to implement than an opensource solution on github pages, and allows for guesting commenting.

Of course, like most third-party services once it's it wants to load a lot of resources and collect cookies without setting any decent sameSite attributes.

This destroys lighthouse scores on any page you add comments.

Lighthouse score for project website without graphcomment:

enter image description here

Lighthouse score for project website with graphcomment:

enter image description here

How would you fix this?

Implement CSP strategy to block individual resources and run tests?

1 answer

  • answered 2021-10-17 20:50 F. Certainly.

    I figured out a solution then found code out there to help get it done.

    Obviously, just lazy load the third-party script, in this case graph-comment's script.

    I did it with window.requestAnimationFrame and an isElementInViewport function, because that's how I run animations in the viewport.

    Then create a script element and inside of the check to see if script element exists, onload your third-party-scripts.

    Works 100% (okay, 99%)

    enter image description here

How many English words
do you know?
Test your English vocabulary size, and measure
how many words do you know
Online Test
Powered by Examplum