Load Local/web Fonts Before Rendering Text

User Experience with local/web fonts in MapLibre GL has shifted how developers approach text on maps, but a critical timing gap remains. Developers often find themselves manually loading fonts before initializing styles - despite MapLibre’s new ability to render text using CSS-defined local/web fonts. The current pattern forces a workaround: either risk premature text rendering or load fonts prematurely, wasting resources.

The core challenge: MapLibre loads glyphs only after they’re fetched, meaning early style application can trigger fallback fonts or incomplete visuals. This frustrates efforts to deliver clean, consistent map labels across diverse user devices.

Behind the frustration lies a deeper cultural shift in web design. Users expect intuitive, typographically rich maps - just like in modern web apps - but technical limits still demand guesswork. Developers now treat font loading as a hidden dependency, not a first-class style prerequisite.

The real oversight? MapLibre doesn’t yet enforce automatic font loading as part of style initialization. While the API supports .font.load(), it’s up to the developer to wait for the promise. This creates a fragile dependency on timing and manual orchestration - something the system could support natively.

Here’s the real catch: without enforced preloads, even well-intentioned code might render text imperfectly. Waiting for local/web fonts before call to render ensures consistency, improves user experience, and aligns with how web fonts are handled elsewhere. It’s not just technical polish - it’s about respecting the user’s visual expectation.

The bottom line: maps should render text as smoothly as a well-typed article online. Why not make the font load part of the style contract? Waiting for local/web fonts before rendering turns a small friction into a seamless experience - one that matches modern web standards.