CF Fonts beta: examples of problems
Have been told the
general-discussions channel isn’t where to report this, so will try here. (Tag choices didn’t really apply.) Re the Cloudflare Fonts beta: I created a mini-site to test how CFF handles Google’s Latin-language variable serif and sans-serif fonts that have italic styles. The ones which CFF currently doesn’t process correctly are the following, with links provided as examples:
- Brygada 1918 (https://cfftest.brycewray.com/cff003/)
- Noto Serif (https://cfftest.brycewray.com/cff009/)
- Source Serif 4 (https://cfftest.brycewray.com/cff014/)
- DM Sans (https://cfftest.brycewray.com/cff022/)
- Exo 2 (https://cfftest.brycewray.com/cff024/)
- Kumbh Sans (https://cfftest.brycewray.com/cff033/)
- Roboto Condensed (https://cfftest.brycewray.com/cff042/)
- Source Sans 3 (https://cfftest.brycewray.com/cff047/)
To be fair, these amount to a small percentage of the fonts I tested! Good job, CFF team! However, some of these are fairly popular choices and, thus, could merit some attention as to why CFF isn’t processing them yet. Thanks.
One thing to note for any other user finding this: where a font has a multi-word name, it’s important to make sure your website feeds the necessary link with an unescaped + between the font name’s words (e.g., Noto+Sans+Display for the Noto Sans Display font). I got help with that in the Hugo Discourse (https://discourse.gohugo.io/t/how-to-unescape-plus-sign-in-url-re-cloudflare-fonts/46734) but, if you’re using a different web-building tool, make sure it’s not escaping the + as &43#; since that appears to complicate things for CF Fonts.8 Replies
Forwarded this to the PM internally.
(also, fun seeing you in another forum. Still appreciate that help on our Hugo image optimizations)
Much obliged and thank you for the kind words! Missed seeing this yesterday or I’d have responded sooner.
Looks like I missed one:
• Jura (https://cfftest.brycewray.com/cff031/)
. . . now added to the original list.
@Kody My mistake: Jura has no italicized form and thus shouldn't have been in this test. I have removed it from my original list above. Sorry!
CF Fonts question, just turned it on. Running a GT Metrix test on webpage page with the DNS having page rules of edge caching for 30 days on everything and running the test 2x so that it is cached for maximum speed. I'm noticing in the waterfall report that where the .woff2 files are loading for the Cloudflare font swap it has a large amount of blocking 70 to 118ms. This seems to be more so than anywhere else in the page. This is surprising to me as I would expect this on the first swap, but in the edge cache situation i would not expect it on the 2nd hit. Thoughts...
Somehow missed that Google Fonts now divides serif fonts into regular serif and slab serif, but there were only three slab serif fonts with both Roman and italic forms — and, of those three, one didn’t work right:
- Aleo (https://cfftest.brycewray.com/cff052/)
. . . although I’m now fearing that CFF is an abandoned project. Everything about it seems to have gone quiet at this point. Hope Google didn’t give you folks problems about the project.
Can't comment on the state of the project since I'm not as in touch with that one, but agree that not much seems to have happened re: the blog.
I saw @nevika_ on the
TheJam.dev event a couple of days ago and asked her about the status of CF Fonts; although I knew she wasn’t the project’s PM, I hoped she might be able to share its status. She wasn’t, understandably — but I do now see that several of the instances I reported earlier are now working. Here’s an update:
- Brygada 1918 (https://cfftest.brycewray.com/cff003/) — Same.
- Noto Serif (https://cfftest.brycewray.com/cff009/) — Fixed.
- Source Serif 4 (https://cfftest.brycewray.com/cff014/) — Same.
- DM Sans (https://cfftest.brycewray.com/cff022/) — Fixed.
- Exo 2 (https://cfftest.brycewray.com/cff024/) — Same.
- Kumbh Sans (https://cfftest.brycewray.com/cff033/) — Same.
- Roboto Condensed (https://cfftest.brycewray.com/cff042/) — Fixed.
- Source Sans 3 (https://cfftest.brycewray.com/cff047/) — Same.
- Aleo (https://cfftest.brycewray.com/cff052/) — Fixed.
. . . and I will update the changed (fixed) test pages accordingly. To whoever is working on this: thanks!I created this related post https://discord.com/channels/595317990191398933/1231578490311151718
It looks like another font that isn't supported is the Material Symbols.
Another one that's failing is the newly released update to the extremely popular font, Inter:
I find that this does remove the preconnect headers but doesn't replace the link tag above with the CFF version.
Test site:
view-source:https://graphite.rs/