1. Home
  2. How to delay loading Google Web Fonts to improve Core Web Vitals score

How to delay loading Google Web Fonts to improve Core Web Vitals score

September 25, 2022

css web vitals performance

Google Web Fonts is just CSS

Good to know: CSS is a render blocking resource. This means it'll block rendering any content until CSS is fully processed!

Given the above, for sure there will be some impact on the Core Web Vitals/Lighthouse score for your web app due to CSS. There are 2 ways to fix this:

  1. Delay loading CSS (make it async)
  2. Inline all of your CSS. (include all of it in the HTML inside a {`