Web et vitesse
Stefan Monnier IFT-1005 1
La vitesse sur le Web
O `u passe le temps Caches
Sprites
Stefan Monnier IFT-1005 2
Waterfalls
Stefan Monnier IFT-1005 3
R ´epartition du temps
La majorit ´e du temps pass ´e `a attendre une r ´eponse Pas mal de temps de connection (DNS et TCP)
Limite de connections concurrentes (par site, et par Javascript) Peu de temps de transfert
Vieille histoire: latence vs bande passante
= ⇒
minimiser le nombre de requ ˆetesStefan Monnier IFT-1005 4
Vitesse du navigateur: Caches
Le navigateur utilise un cache pour minimiser le nombre de requ ˆetes Beaucoup de requ ˆetes partag ´ees avec d’autres pages web
Beaucoup de requ ˆetes servies depuis le cache Beaucoup mais pas assez!
Il faut v ´erifier la fraˆıcheur du cache
V ´erifier la fraˆıcheur est presque aussi co ˆuteux!
Stefan Monnier IFT-1005 5
Vitesse du site
R ´ef ´erencer une ressource standard profite du cache
•
R ´eduit le temps de transfert seulement!Consolider
•
les feuilles de style en une!•
Consolider les codes Javascript en un!•
Ou m ˆeme les inclure inline!Il reste les images
Stefan Monnier IFT-1005 6
Vitesse du site: images
Souvent, la majorit ´e des r ´ef ´erences externes Deux techniques de r ´eduction des r ´ef ´erences:
• data:
URLs permettent d’inclure les images inline Augmente le temps de transfert (de 33%)Mauvaise interaction avec les caches
•
CSS Sprites combinent plusieurs images en une Mettre les images parbackground-image
Propri ´et ´e
background-position
pour choisir la sous-image Avecwidth
etheight
bien s ˆurMalpratique, mais efficace
Stefan Monnier IFT-1005 7