search

sangheon-kim / dev-full-stack

Training
7 stars 1 forks source link

[My Debug Note#2] - getTTFB, getCLS는 동작하나 getFID, getFCP, getLCP는 동작하지 않는문제 (해결완료) #3

Closed sangheon-kim closed 3 years ago

sangheon-kim commented 3 years ago

build한 결과물을 압축한 vitals.zip으로 아카이브한 파일을 압축해제하여 정적파일 놓은 후 

<head>
<!-- ...  -->
<!-- defer를 두어, 로드를 블로킹 하는것을 막는다. -->
<script defer src="./vitals/polyfill.js"></script>
<!-- ...  -->
</head>
<body>
<!-- ...  -->
<script defer src="./vitals/web-vitals.base.umd.js"></script>
<script>
  window.addEventListener("DOMContentLoaded", function() {
    webVitals.getCLS(console.log);
    webVitals.getFID(console.log);
    webVitals.getFCP(console.log);
    webVitals.getLCP(console.log);
    webVitals.getTTFB(console.log);
  })
</script>
</body>
sangheon-kim commented 3 years ago

before

<script defer src="./vitals/web-vitals.base.umd.js"></script>

after (base.umd.js -> umd.js)

<script defer src="./vitals/web-vitals.umd.js"></script>