Skip to main content

optimize-web-font-loading

Optimize web font loading for fast text, stable metrics, bounded files, and resilient fallback. Use when fonts delay rendering, shift layout, or fail across networks and scripts.

Informations de source

Dépôt
protosphinx/sphinxstack
Dernière activité de la source
29 juillet 2026 à 13:55
Langue détectée de SKILL.md
anglais
Étoiles
3
Forks
0

Options d'installation

Le prompt qui vérifie d'abord la source est sélectionné par défaut. Vous pouvez passer à une commande directe ou télécharger une copie locale.

Vérifiez les fichiers source

Lisez SKILL.md et les fichiers associés affichés par SkillsMP avant de décider de l'installer.

Explorateur de fichiers
2 fichiers

Affichage de SKILL.md

SKILL.md
Instructions source · Aperçu en lecture seule
name
optimize-web-font-loading
category
web
description
Optimize web font loading for fast text, stable metrics, bounded files, and resilient fallback. Use when fonts delay rendering, shift layout, or fail across networks and scripts.
# optimize-web-font-loading Deliver only the faces needed and make fallback acceptable at every moment. ## Procedure 1. Inventory families, weights, styles, scripts, pages, licenses, and actual use. 2. Remove unused faces and subset only with verified language coverage. 3. Prefer modern compressed formats and same-origin delivery where practical. 4. Define preload only for critical above-fold faces and correct cross-origin behavior. 5. Choose `font-display` from the content and brand tradeoff. 6. Match fallback metrics to reduce reflow and preserve readable text. 7. Set immutable cache URLs, correct MIME, CORS, and versioning. 8. Test cold, warm, slow, offline, blocked-font, localization, and zoom cases. 9. Measure text render, layout shift, transfer, and cache reuse before and after. ## Guardrails - Do not subset away required languages or symbols. - Preloading every font competes with more critical resources. - Licensing terms remain part of deployment readiness. ## Done - A font inventory and delivery report records every retained face - Fallback, localization, failure, and cache cases are tested - Render timing and layout stability improvements are verified
Voir sur GitHub