The latest articles on DEV Community by Punit Sethi (@geekybiz_3). https://dev.to/geekybiz_3 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F405942%2Ff9fffbaf-8f96-4cdb-ade4-add73e521910.jpeg https://dev.to/geekybiz_3 en Punit Sethi Wed, 10 Jun 2020 10:31:28 +0000 https://dev.to/geekybiz_3/google-s-new-pagespeed-measures-in-plain-english-10cj https://dev.to/geekybiz_3/google-s-new-pagespeed-measures-in-plain-english-10cj <p>With <a href="https://web.dev/lighthouse-whats-new-6.0/">Lighthouse 6.0</a>, Google introduced a few new Site Speed measures (also known as <a href="https://web.dev/vitals/">Web Vitals</a>). You can see these when you run PageSpeed tests &amp; how they affect your PageSpeed / Lighthouse score.</p> <p>This post is a jargon-free &amp; simple description of these measures:</p> <h3> Cumulative Layout Shift </h3> <p>Remember the last time you tried to click a link &amp; the link changed it’s position. And, this caused your click to land you on a different page? This metric addresses such experiences.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--mPz9MA97--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/o9oqr1d6jln9sqcmxryw.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--mPz9MA97--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/o9oqr1d6jln9sqcmxryw.png" alt="Cumulative Layout Shift"></a></p> <h3> First Input Delay </h3> <p>Remember when you tap a button, link or text-box as the page is loading and nothing seems to happen forever? This metric addresses such experiences.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--3NdaPcPw--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/ag0lnhai7qogd8i2cfqv.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--3NdaPcPw--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/ag0lnhai7qogd8i2cfqv.png" alt="First Input Delay"></a></p> <h3> Largest Contentful Paint </h3> <p>The time when the largest visible content element on screen is fully displayed.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--wLESOAPN--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/w5eepchbmnvm26wykp07.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--wLESOAPN--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/w5eepchbmnvm26wykp07.png" alt="Largest Contentful Paint"></a></p> <p>To understand the above metrics in greater detail, check <a href="https://web.dev/vitals/">this</a> Google web.dev article.</p> <p>Your feedback, thoughts &amp; opinion on the above are welcome.</p> webperf webdev pagespeed