Optimiser les transfère de page

Il existe un moyen de réduire considérablement la taille des transfères de vos page de site. J’ai récemment testé cette méthode qui m’a réduit de pratiquement 70% la taille de mes pages. Ce n’est pas le cas pour ce blog actuellement, mais je vais bientôt remettre à jour mon système pour l’utiliser. Pour l’heure, je vais vous expliquer le principe.

Le principe est simple, il suffit de compresser avec gzip vos pages, CSS, javascripts… Par contre il ne faut le faire que si, et seulement si, le navigateur qui va lire les données peut comprendre et décompresser vos données. PHP va vous permettre de le faire avec une aisance sans conteste.

Si comme moi vous utiliser une framework, disons “Copix”, vous allez commencer par modifier le fichier index.php et y ajouter en tout début de fichier:

if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) ob_start("ob_gzhandler"); else ob_start();

Cela veut dire que si le client accepte “gzip” alors nous ouvrons le buffer en compressant les données via “ob_gzhandler”. Sinon, le buffer est ouvert normalement.

Cela a pour effet de réduire les données envoyées vers le client de près de 60%. Je ne compte pas les images qui ne sont pas envoyées au même moment. Cela ne comprend que le HTML envoyé. L’import de CSS, javascript etc… est pour l’instant envoyé sans modification de compression.

Justement, pour le CSS et le javascript, vous allez changer le fichier. La modification est rapide et vous pourrez le faire pour tous vos nouveau fichiers css et javascript.

Changer le nom de vos fichiers en y ajoutant l’extension “.php”. Par exemple, un fichier “foo.css” devient “foo.css.php”.

Dans ce fichier, ajoutez ce code en tout début de fichier, sans retour à la ligne ou espace le précédent:

<?php if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')){ ob_start ("ob_gzhandler"); } header("Content-type: text/css; charset: UTF-8"); header("Cache-Control: must-revalidate"); $offset = 60 * 60 ; $ExpStr = "Expires: " . gmdate("D, d M Y H:i:s", time() + $offset) . " GMT"; header($ExpStr); ?>

Ici pour du CSS et sinon pour le javascript: <?php if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')){ ob_start ("ob_gzhandler"); } header("Content-type: text/javascript; charset: UTF-8"); header("Cache-Control: must-revalidate"); $offset = 60 * 60 ; $ExpStr = "Expires: " . gmdate("D, d M Y H:i:s", time() + $offset) . " GMT"; header($ExpStr); ?>

Cela invoque au navigateur que ce n’est pas du php mais bien du CSS ou du javascript qu’il recevra. Si en plus le navigateur accepte “gzip” alors la compression se met en place.

Résultat des courses, sans compression mon test envoyait 190ko de données (dont mootools, 3 CSS et pas mal de texte dans la page)… avec compression, j’atteins les 40ko de données.

Cette méthode est de plus en plus utilisée sur le net, et cela permet de faire souffler un peu les serveurs. Diminuer la taille des transfère est déjà un sacré pas vers l’optimisation de vos sites, alors n’hésitez pas à utiliser cette méthode, elle est facile et efficace.

comments powered by Disqus