Éviter les énormes charges utiles de réseau

Les charges utiles des grands réseaux sont fortement corrélées aux longs temps de chargement. Elles coûtent également de l'argent aux utilisateurs ; par exemple, ils peuvent avoir à payer plus de données mobiles. Réduire la taille totale des requêtes réseau de votre page est donc bénéfique pour l'expérience des utilisateurs sur votre site et pour leurs portefeuilles.

Échec de l'audit de charge utile réseau Lighthouse

Lighthouse indique la taille totale en kibioctets (Kio) de toutes les ressources demandées par votre page. Les requêtes les plus importantes sont présentées en premier:

Capture d'écran de l'audit sur Lighthouse "Éviter les charges utiles réseau volumineuses"

D'après les données d'archive HTTP, la charge utile réseau médiane est comprise entre 1 700 et 1 900 Kio. Pour vous aider à détecter les charges utiles les plus élevées, Lighthouse signale les pages dont le nombre total de requêtes réseau dépasse 5 000 Kio.

Réduire la taille de la charge utile

Essayez de ne pas dépasser 1 600 Kio au total. Cet objectif est basé sur la quantité de données pouvant être théoriquement téléchargée sur une connexion 3G tout en atteignant un délai avant interactivité de 10 secondes ou moins.

Voici quelques moyens de réduire la taille de la charge utile:

Conseils spécifiques à la pile

Angular

Appliquez une division du code au niveau du routage pour réduire la taille de vos groupes JavaScript. Envisagez également d'effectuer la mise en cache préalable des éléments avec le service worker Angular.

Drupal

Pensez à utiliser des styles d'image responsifs pour réduire la taille des images chargées sur votre page. Si vous utilisez les vues pour afficher plusieurs éléments de contenu sur une page, envisagez d'implémenter la pagination pour limiter le nombre d'éléments de contenu affichés sur une page donnée.

Joomla

Envisagez d'afficher des extraits dans vos catégories d'articles (une solution populaire est le lien "En savoir plus"), de réduire le nombre d'articles affichés sur une page donnée, de répartir vos longs posts sur plusieurs pages ou d'utiliser un plug-in pour charger les commentaires de manière différée.

WordPress

Envisagez d'afficher des extraits dans vos listes d'articles (vous pouvez utiliser la balise "more"), de réduire le nombre d'articles affichés sur une page donnée, de répartir vos articles longs sur plusieurs pages ou d'utiliser un plug-in pour charger les commentaires de manière différée.

Ressources

Code source pour l'audit Éviter les charges utiles de réseau énormes