Archived topic
Google fonts and page speed
3 replies · Started by Ed on November 22, 2019
I'm using a Google font within the theme editor, but am seeing some resource slowdowns from it. This URL has a relatively large savings potential (https://fonts.googleapis.com/css?family=Montserrat:regular,italic|Merriweather:300,300italic,regular,italic,700,700italic,900,900italic), but what's strange is that I'm only using Montserrat regular and italic in the customizer (plus inherit in the other settings). So I understand that part of this is Google being weird (based on other posts) - but it seems like it's pulling in data that I'm not using?
Also, it's telling me to "Leverage the font-display CSS feature to ensure text is user-visible while webfonts are loading" - how should I go about doing that (and is that something I should do)?
Thanks!
Hi Ed,
That's strange - it should only load the variants you tell it to. Just to confirm, in the Customizer where you've set Merriweather, what variants are listed under it?
As for the font-display, you can do this: https://generatepress.com/forums/topic/add-font-display-swap/#post-993058
Let me know :)
So - the good news is that I found a Merriweather mixed in there in the customizer, so now I just have Montserrat bold and italic. But, when I go into the link (https://fonts.googleapis.com/css?family=Montserrat:regular,italic), it's pulling in character types that I don't use (cyrillic, vietnamese, etc). And, the impact on the load time (230ms) is the same as it was before. Is there a way to only bring in the characters I'm using?
Hi there,
Try this:
add_filter( 'generate_fonts_subset', function() {
return 'latin';
} );
More info here: https://docs.generatepress.com/article/generate_fonts_subset/