Web performance
#How to improve it ?
@doc_roms
Romuald
Twitter : @doc_roms
LeadDev
- Performance
- Qualité (a11y, éthique, sécurité… )
- Eco-conception
- Ecologie
- Numérique Responsable
- Inclusion & Accessibilité
Performance ?
Web Performance - MDN
Les performances web correspondent au temps nécessaire à un site pour se charger, devenir interactif et réactif, et à quel point le contenu est fluide pendant les interactions des utilisateurs - le défilement est-il fluide ? les boutons sont-ils cliquables ? Les fenêtres contextuelles sont-elles rapides à charger et à afficher, et s'animent-elles en douceur pendant qu'elles le font ?
Performance - ISO
Exigences de qualité et évaluation des systèmes et du logiciel (SQuaRE) — Modèles de qualité du système et du logiciel
ISO 25010:2002
Performance - ISO
ISO 25010:2002
Performance - ISO
ISO 25010:2002
| Temps de réponse | Capacité | Utilisation de ressources |
|---|---|---|
| Une application qui répond rapidement | Une application qui répond tout le temps | Une application sobre |
Pourquoi mon site est "lent" ?
Un problème de serveur
Résolution DNS ?
Temps de connexion ?
SSL ?
Compression ?
Cache ?
HTTP/2 ?
Un problème de poids
HTML ?
CSS ?
Images ?
Vidéos ?
Un problème de conception
JS async / defer ?
Ordre des ressources ?
LazyLoad ?
Text
JS async / defer ?
Ordre des ressources ?
LazyLoad ?
Bref
Les problèmes peuvent-être divers et variés
Coté back (config ou problème serveur)
Réseau (site trop lourd)
Coté Front (site avec pb de conception)
Solution ?
Analyser les pages du site
Avoir une politique de performance web
Sobriété
SpeedIndex
TTFB
LCP
FCP
FCP
CLS
FCP
TTFP
FID
Démo !
Merci !
@doc_roms
Des questions ?