Ce que c'est
Avant qu'un navigateur puisse afficher la moindre partie d'une page, il doit d'abord télécharger entièrement le document HTML de la page (ou du moins assez pour commencer à travailler) — c'est distinct des images, vidéos ou autres médias, qui se chargent ensuite. Cette vérification examine précisément la taille de ce document HTML initial, et la signale quand elle est devenue anormalement grande.
Les documents HTML gonflent généralement en taille quand beaucoup de contenu est intégré directement en ligne — de gros blocs de code de style, des scripts, ou du contenu répété collé directement dans la page — plutôt que d'être conservé dans des fichiers séparés et réutilisables que le navigateur peut charger une fois et mettre en cache.
Pourquoi c'est important
Un document HTML plus volumineux met un temps mesurablement plus long à se télécharger et à être traité avant que le navigateur puisse commencer à afficher quoi que ce soit, ce qui retarde la toute première chose qu'un visiteur voit, pas seulement le contenu secondaire plus bas dans la page. Cet effet est plus marqué sur les connexions mobiles lentes, où chaque donnée supplémentaire ajoute un temps réel et ressenti avant que la page commence à sembler réactive.
Un fichier HTML surchargé est aussi souvent le symptôme d'un problème structurel plus profond — du contenu ou du code qui aurait dû être organisé dans des fichiers séparés et mis en cache, mais qui est plutôt dupliqué en ligne sur toute la page, voire sur toutes les pages du site.
Comment le corriger
- Identifie ce qui compose l'essentiel du fichier — les outils de développement du navigateur peuvent montrer la répartition de la taille des ressources d'une page, y compris le document HTML de base lui-même.
- Déplace les gros blocs de CSS en ligne (code de style) vers un fichier
.cssséparé que le navigateur peut charger une fois et réutiliser sur plusieurs pages, plutôt que de le répéter en ligne sur chaque page. - Déplace le JavaScript en ligne volumineux vers des fichiers
.jsséparés pour la même raison. - Vérifie s'il y a du contenu accidentellement dupliqué dans le code de la page (le même bloc répété plusieurs fois) et supprime les doublons.
- Si tu utilises un créateur de site, cela est généralement déjà géré pour toi — une page anormalement volumineuse ici est plus souvent due à un bloc de code personnalisé lourd qu'à la plateforme elle-même, donc vérifie les blocs de code personnalisés que tu as ajoutés.