Performance & Vitesse

Analyse PageSpeed Insights et Core Web Vitals

📱 Performance Mobile

80
Score Lighthouse / 100

💻 Performance Desktop

90
Score Lighthouse / 100

🔍 Diagnostic de Performance IA

Actuellement, le site OpenGraphy affiche des scores PageSpeed de 80/100 pour mobile et 90/100 pour desktop, ce qui indique une performance assez solide, mais avec des marges d'amélioration possibles, surtout pour les utilisateurs mobiles. Les principales causes des ralentissements proviennent certainement de la taille globale de la page, bien que celle-ci reste raisonnable, et potentiellement d'éléments non optimisés comme les images ou les scripts. Avec un chargement de 0.05 secondes, le site semble rapide, mais des vérifications sur des réseaux plus lents sont nécessaires. Comparé aux standards actuels du mobile-first, renforcer la vitesse et la réactivité sur mobile serait bénéfique pour offrir une expérience utilisateur sans friction, surtout dans un contexte où les utilisateurs mobiles deviennent majoritaires.

Sélectionner l'appareil

📊 Scores Lighthouse Mobile

Performance
80
/ 100
🎯 SEO
0
/ 100
Accessibilité
0
/ 100
Best Practices
0
/ 100

🎯 Core Web Vitals Mobile

Survolez les métriques pour voir leur explication

🎨
1.8s
First Contentful Paint
Survolez pour plus d'infos
🎨
First Contentful Paint
Temps avant que le premier élément de contenu (texte, image) soit visible. Bon < 1.8s
Impacte la perception de vitesse par l'utilisateur.
🖼️
2.4s
Largest Contentful Paint
Survolez pour plus d'infos
🖼️
Largest Contentful Paint
Temps avant que le plus grand élément visible soit chargé. Bon < 2.5s
Core Web Vital crucial pour le SEO Google.

📋 Audits détaillés

🚀 Quick Wins - Actions Rapides

#1
Implémenter le Lazy Loading pour les images

💡 Impact: Amélioration du temps de chargement initial de 30-40%

⏱️ Temps estimé: 1 heure

Easy
#2
Minifier CSS et JavaScript

💡 Impact: Réduction de la taille des fichiers de 20-30%

⏱️ Temps estimé: 1 heure

Easy
#3
Activer la compression GZIP/Brotli

💡 Impact: Réduction de 60-80% de la taille des fichiers transférés

⏱️ Temps estimé: 30 minutes

Easy

⚙️ Optimisations Recommandées (6)

Optimiser les images

Réduire la taille des images en utilisant des formats modernes comme WebP et appliquer un chargement différé (lazy loading).

Gain: 0.5s
🛠️ Outils recommandés:
ImageOptim TinyPNG
📊 Difficulté:
Medium
💻 Exemple de code:
<img src='example.webp' loading='lazy'>
Minifier les fichiers CSS

Réduire la taille des fichiers CSS en supprimant les espaces et les commentaires superflus pour diminuer le temps de chargement.

Gain: 0.3s
🛠️ Outils recommandés:
CSSNano PostCSS
📊 Difficulté:
Low
💻 Exemple de code:
npx cssnano styles.css styles.min.css
Différer le chargement des scripts JavaScript

Utiliser l'attribut async ou defer sur les scripts non critiques pour qu'ils ne bloquent pas le rendu initial de la page.

Gain: 0.4s
🛠️ Outils recommandés:
Lighthouse GTmetrix
📊 Difficulté:
Medium
💻 Exemple de code:
<script src='example.js' defer></script>
Précharger les polices

Utiliser l'attribut preload pour précharger les polices critiques afin de réduire les délais lors de la première utilisation.

Gain: 0.2s
🛠️ Outils recommandés:
Google Fonts Font Squirrel
📊 Difficulté:
Medium
💻 Exemple de code:
<link rel='preload' href='font.woff2' as='font' type='font/woff2' crossorigin='anonymous'>
Activer la compression

Utiliser GZIP ou Brotli pour compresser les réponses HTTP afin de réduire la taille des charges utiles.

Gain: 0.3s
🛠️ Outils recommandés:
Nginx Apache
📊 Difficulté:
Medium
💻 Exemple de code:
gzip on;
Mettre en cache les ressources statiques

Configurer des headers Cache-Control appropriés pour éviter de recharger inutilement des ressources statiques.

Gain: 0.6s
🛠️ Outils recommandés:
Cloudflare AWS CloudFront
📊 Difficulté:
Low
💻 Exemple de code:
Cache-Control: max-age=31536000