Jason Pamental

Progressive Font Enrichment: reinventing web font performance

https://mailchi.mp/fe0fa657733a/web-typography-news-11-progressive-font-enrichment-naming-things-is-hard-edition?e=6d09bc30d0

In issue #11 of his great Web Fonts & Typography News newsletter, Jason Pamental shares the progress made by the W3C Web Fonts Working Group towards a new way to progressively serve fonts so that only the required new glyphs are downloaded every time new characters have to be rendered.

Think server side dynamic subsetting that remembers what it already sent to the browser.

They call it "Progressive Font Enrichment", and it looks awesome.

There's even a live demo of progressive font enrichment.

Couple that capability with variable fonts, and the combination could be simply transformative for the design possibilities on sites using [Chinese, Japanese, Arabic, Vietnamese, and other more complicated languages with much larger sets of glyphs]. After years of promise shackled to performance constraints, this will be nothing short of revolutionary.

• older link:
  Fading out siblings on hover in CSS
• newer link:
  Implementing a Mockup: CSS Layout Step by Step

---

Related contents with similar topics

1. 

   Matthias Ott

   The Right Way to Use fonts.com Web Fonts

   • Nicolas Hoizey
   • 21 December 2022
   • font, WebPerf, CSS
   • 1 reaction

   Let’s talk about web fonts. More specifically, about a mistake I have seen developers make in several projects for different agencies: Embedding a…

2. 

   Malte Ubl

   Perfect-ish font fallbacks

   • Nicolas Hoizey
   • 27 September 2022
   • font, WebPerf, CSS
   • 17 reactions

   a tool that automatically matches the fallback font to the custom font–because computers are good at that stuff. The tool allows you to select every…

3. 

   Brian Louis Ramirez

   Fallback Font Generator

   • Nicolas Hoizey
   • 27 September 2022
   • WebPerf, font, CSS, CLS
   • 32 reactions

   Reduce Cumulative Layout Shift (CLS) by adjusting web fonts and system font fallbacks using special @font-face descriptors.

4. • Nicolas Hoizey
   • 13 January 2022
   • Cloudflare, font, WebPerf
   • 18 reactions
   • permalink

   My photography site is hosted on #Cloudflare, and they transform preload into HTTP/2 push. Great!

   But why is my preloaded/pushed font downloaded twice then? 😅

   

5. 

   Sara Soueidan

   How I set up Glyphhanger on macOS for optimizing and converting font files for the Web

   • Nicolas Hoizey
   • 3 June 2021
   • WebPerf, font, tool
   • 9 reactions

   I already had Glyphhanger installed on my computer, but I remember having similar issues, so Sara's article is welcome for anyone who wants to use…