Analyse de qualité et performance web outil non intrusif.
https://larselesrse.blogspot.com/
Rapport généré le 20 août 2022 19:36:18Les bases sont là.
10
Problèmes
11
Améliorations
62
Succès
Analyse performance et qualité de https://larselesrse.blogspot.com/ (dareboost.com)
Extrait du rapport (vraiment complet) :
Bonnes pratiques et conseils : Toutes les catégories.
Ce que vous pouvez améliorer : Volume de données 0/100
Cette page charge 3.1 Mo de données, diminuez ce poids
Le poids de votre page est important, ce qui ralentit sa vitesse d’affichage, d’autant plus sur les connexions bas débit. Cela peut également générer de la frustration pour vos internautes qui sont limités par des forfaits data (voir whatdoesmysitecost.com).
Situer le poids de ma page web
Selon HTTPArchive, en juillet 2019, le poids moyen d'une page web était de 1.95Mo.
Comment réduire le poids de ma page ?
Vous pouvez vous reporter à notre catégorie "Volume de données" pour voir quelles sont les optimisations possibles dans votre cas. De manière générale, les images sont souvent à pointer du doigt.
Veillez aussi à construire vos pages web de manière à charger d’abord ce qui est essentiel à l’internaute en priorité (optimisation du chemin critique de rendu).
Pour tout autre contenu (plugins de réseaux sociaux, publicités, contenus situés en bas de page...), il est préférable de différer le chargement (asynchrone, lazy-loading...), pour ne pas pénaliser les contenus prioritaires.
Nous vous conseillons par ailleurs fortement de définir des budgets de performance pour mener à bien vos projets web. Ces budgets sont paramétrables grâce à la fonctionnalité de monitoring de Dareboost.
Afin de vous aider à établir vos priorités d'optimisation, voici la répartition du poids de la page par type de ressources :
JavaScript : 50.00% du poids total
Images : 37.72% du poids total
Textes : 4.76% du poids total
JSON : 4.66% du poids total
CSS : 2.29% du poids total
Polices de caractères : 0.52% du poids total
Par ailleurs, voici les 50 ressources les plus lourdes qui sont téléchargées lors du chargement de votre page :
Volume de données 0/100
2 images sont redimensionnées côté navigateur
Si vos images sont plus grandes que leur zone d'affichage, le navigateur téléchargera des données inutiles et procédera à des redimensionnements disgracieux.
Éviter le redimensionnement d'images côté navigateur
Lorsqu’il souhaite afficher une image dans votre page, le navigateur fait tout son possible pour l'adapter à sa surface de rendu. Si l'image est trop grande, il la réduit.
Fournissez directement vos images aux dimensions d'affichage utilisées sur votre site. Vous évitez ainsi l'envoi de données inutiles sur le réseau, ce qui diminue le temps de chargement de la page.
Comme les algorithmes embarqués dans les navigateurs ne sont pas aussi bons que ceux des outils dédiés à la manipulation d’images, vous obtiendrez un résultat visuel plus satisfaisant en redimensionnant vos images en amont, plutôt qu’en laissant le navigateur le faire.
Utiliser des Images Adaptatives (Responsive)
Plusieurs méthodes existent, permettant de servir des images adaptées au navigateur quelle que soit la résolution de l’écran ou la densité de pixels du matériel. Nous vous conseillons de lire les ressources suivantes :
"Images adaptatives", sur le Mozilla Developer Network (MDN)
Picturefill, permet d’utiliser l'élément <picture> dans des navigateurs qui ne le supportent pas encore (EN)
RICG, groupe de travail sur les images responsive (EN)
Ne redimensionnez pas les images suivantes :
blogger.googleusercontent.c[...]0(267).png (taille d'affichage : 250x141)
docs.microsoft.com/fr-fr/sy[...]t-main.png (taille d'affichage : 570x365)
Sur cette page, 2 images sont redimensionnées de moins de 40 % de leur taille. Plusieurs techniques de Responsive Web Design reposent sur le redimensionnement d'images dont les tailles sont proches de leurs surfaces de rendu respectives. Il est donc possible que des redimensionnements de ce type soit désirés, et nous ne les pénalisons pas. Cependant, nous vous invitons à vous assurer qu'il n'affecte pas les performances de la page :
www.gstatic.com/images/bran[...]e_24dp.png (taille d'affichage : 20x20)
www.gstatic.com/images/bran[...]2x16dp.png (taille d'affichage : 37x14)
Pour en savoir plus sur l’optimisation des images, vous pouvez lire cet article sur le sujet.
Autres outils
Pierre Erol GIRAUDY
Aucun commentaire:
Enregistrer un commentaire