2 avril 2024 : WordPress 6.5 sort officiellement, avec parmi ses apports la Font Library, une interface native de gestion des polices directement dans l’éditeur de site. Ce billet ne traite pas de l’Interactivity API, autre grande nouveauté de cette version, mais se concentre uniquement sur ce que la gestion des polices change concrètement pour la performance d’affichage.
Avant cette version, la plupart des thèmes chargeaient leurs polices soit via une feuille de style externe pointant vers Google Fonts, soit via un fichier local ajouté manuellement au thème. Les deux approches fonctionnaient, mais la première introduisait une dépendance à un domaine tiers, avec son lot de requêtes DNS et de connexions supplémentaires, deux facteurs qui pèsent directement sur le Largest Contentful Paint quand l’élément principal de la page est un titre ou un bloc de texte utilisant cette police.
Ce que change la Font Library concrètement
La Font Library ajoute un écran dans l’éditeur de site permettant d’installer des polices, de les auto-héberger directement dans l’installation WordPress, et de les rendre disponibles au thème comme aux blocs individuels via l’interface graphique, sans écrire de code. Techniquement, les polices installées via cette interface sont stockées dans le dossier wp-content/uploads/fonts et déclarées via des règles @font-face générées automatiquement, avec les métadonnées associées enregistrées comme entrées du type de contenu wp_font_family.
Ce mécanisme repose sur de nouvelles fonctions internes, dont wp_get_font_collections() pour lister les collections de polices disponibles, et une nouvelle table de métadonnées pour associer chaque police à ses variantes de graisse et de style.
L’effet direct sur le LCP
Quand l’élément le plus visible au chargement d’une page est un titre utilisant une police personnalisée, le navigateur doit récupérer cette police avant de pouvoir afficher le texte dans son style final, ou afficher un texte de repli le temps du chargement selon la valeur de font-display. Avec une police hébergée sur un domaine externe comme celui de Google Fonts, cette récupération implique une résolution DNS, une négociation TLS et une requête HTTP vers un serveur distinct de celui qui sert la page elle-même.
Avec une police auto-hébergée via la Font Library, ce fichier provient du même domaine que le reste du site, ce qui supprime la latence de connexion vers un tiers. Sur une page d’accueil dont le LCP était porté par un titre en police personnalisée, ce changement seul a permis de réduire le délai de rendu de cet élément de plusieurs centaines de millisecondes dans les mesures effectuées après migration vers la Font Library.
Un point de vigilance : le préchargement
L’auto-hébergement seul ne suffit pas toujours. Sans préchargement explicite via une balise <link rel="preload"> pointant vers le fichier de police critique, le navigateur ne découvre cette ressource qu’après avoir analysé la feuille de style qui la référence, ce qui retarde son chargement. La Font Library ne génère pas ce préchargement automatiquement pour l’instant : c’est au thème ou à un ajout dans functions.php de s’en charger pour la police utilisée par l’élément le plus visible.
Comment vérifier concrètement l’impact
- Ouvrir l’onglet réseau des outils de développement du navigateur et repérer le domaine d’origine de chaque requête de police.
- Comparer le temps de première peinture du texte avant et après migration vers une police auto-hébergée, avec l’outil Lighthouse ou une mesure de terrain.
- Vérifier dans le rapport Core Web Vitals de la Search Console si le LCP mobile progresse dans les semaines suivant la migration.
Ce que la Font Library ne résout pas d’elle-même
Installer une police via cette interface ne garantit pas automatiquement un LCP optimal. Une police mal choisie, avec un fichier volumineux ou un nombre excessif de graisses installées inutilement, continue de peser sur le poids total de la page. La Font Library facilite la gestion et l’auto-hébergement, mais ne remplace pas un choix raisonné du nombre de variantes réellement utilisées par le thème.
Une bonne pratique simple : n’installer via la Font Library que les graisses et styles réellement appelés par les feuilles de style du thème, jamais la famille complète par défaut.
En résumé
La Font Library de WordPress 6.5 déplace la gestion des polices d’un ensemble de bonnes pratiques manuelles vers une interface native, avec un bénéfice réel pour le LCP dès lors que l’auto-hébergement remplace une dépendance à un domaine tiers. Le gain de performance n’est cependant pas automatique : il dépend toujours du nombre de polices installées, de leur poids, et d’un préchargement correctement configuré pour l’élément le plus visible de la page.
