Accélérer un site web

L'accélération de l'affichage d'un site Web ou d'eCommerce repose sur la conjugaison de nombreuses techniques qui vont bien au-delà de la simple compression. Il s'agit à la fois de diminuer la taille des données téléchargées par le navigateur, de diminuer le nombre de requêtes, de faciliter et d'optimiser la mise en page effectuée par le navigateur. La diminution de la taille des objets téléchargés par le navigateur repose sur plusieurs types de compressions et d'optimisations.

Cependant le nombre de requêtes prend une part importante du temps d'affichage car il nécessite autant d'aller-retour que de requêtes. Ceci est d'autant plus important que le round trip time (RTT) est important. Pour fixer les idées : 50 requêtes avec 30 ms de RTT engendrent un temps de latence pure de 1.5 secondes et ce, indépendamment de la taille des objets téléchargés et de la bande passante.

Diminution de la tailles des données

La diminution de la taille des données téléchargées par le navigateur afin d'afficher une page HTML repose sur plusieurs types de compressions : la compression sans perte dite aussi lossless-compression et plusieurs autres compressions avec perte telles que la compression des images et la minification.

Compression sans perte

La compression sans perte permet de retrouver la donnée initiale intacte après la décompression. Rappelons que celle-ci est effectuée par le navigateur lui-même.

Il existe plusieurs algorithmes de compression. Les deux plus utilisés sont gzip et deflate. Certains navigateurs acceptent aussi la compression par bloc bzip2 qui est un peu plus performante mais également beaucoup plus gourmande en puissance de calcul.

En savoir plus

Optimisation des images et Minification

Aux compressions sans perte s'ajoutent des compressions avec perte dites aussi lossy-compression. C'est le cas de l'optimisation des images. Supprimer de l'information est en effet la seule solution pour diminuer la taille des images.

En savoir plus

La minification est aussi une compression avec perte mais elle est sémantiquement transparente car les données supprimées sont des données inutiles. La minification s'applique aux pages HTML, aux feuilles de style CSS et aux scripts.

Diminuer le nombre de requêtes

Une page web est composée d'un fichier HTML qui contient le texte, des indications de valeurs (markup) ainsi que la listes de tous les composants qui constituent la page et qui doivent donc tous être téléchargés par le navigateur afin de faire la mise en page complète. Ces composants sont des feuilles de style (fichier CSS), scripts et de nombreuses images. Une page web moyenne contient une centaine de composants ce qui implique que le navigateur doit soumettre une centaine de requêtes HTTP au serveur web.

La durée de chaque requête est composée du temps de téléchargement (un volume divisé par la bande passante) et du temps de propagation aller-retour de la requête qu'on appelle le round trip time. La taille moyenne des composants est de 15kO. Pour une bande passante moyenne de 10Mb/s et un RTT moyen de 40ms, on voit que le temps de téléchargement est de 12ms soit environ un tiers du temps de propagation aller-retour. On comprend donc que très souvent il est plus important de réduire le temps aller-retour plutôt que le temps de téléchargement.

Un moyen radical pour atteindre cet objectif est de réduire le nombre de requêtes. Cela repose sur deux techniques :

  • La maîtrise et l'exploitation des caches des navigateurs,
  • et l'optimisation globale, c'est-à-dire une réécriture partielle de la page HTML.
En savoir plus