lansingcodes / www

Events and resources for Lansing coders
https://www.lansing.codes
Other
7 stars 16 forks source link

Ensure text remains visible during webfont load #147

Closed egillespie closed 2 years ago

egillespie commented 2 years ago

Describe the bug

From Chrome's Lighthouse report:

image

To Reproduce

  1. Open https://lansing.codes in a new Chrome Incognito window
  2. Open Chrome DevTools
  3. Select the Lighthouse tab
  4. Check "Performance" and "Desktop"
  5. Run the audit

Expected behavior

The website text should appear immediately using a system font and then switch to the web font once it finishes downloading.

See Ensure text remains visible during web font load for details about fixing this issue.

After the fixes are applied, the Lighthouse audit should not red-flag this issue.

dwenzlick commented 2 years ago

@egillespie - one of the fonts is from 'https://cdnjs.cloudflare.com/ajax/libs/font-mfizz/2.4.1/font-mfizz.min.css', referenced in /www/nuxt.config.js

Is this possible to fix without to contributing to cloudfare's css?

egillespie commented 2 years ago

If there doesn't appear to be a new version of MFizz (and @/ajm-kohaku said there's not), can you create a new issue to specifically handle this issue with MFizz and we'll merge the other changes to keep you moving forward?

dwenzlick commented 2 years ago

Created follow-up https://github.com/lansingcodes/www/issues/155

egillespie commented 2 years ago

Closing this issue. The remaining bits can be addressed with #155 and lansingcodes/webfont#9.