web-dev-qa-db-fra.com

Compresser des images pour les sites Web et mobiles ou ajuster la taille?

Je regardais http://marcjschmidt.de/blog/2013/10/25/php-imagepng-performance-slow.html et vers la fin du document, j'ai appris quelque chose du graphique à la fin.

Si j'utilise une compression très élevée sur une image, le temps de traitement (y compris TTFB) sera plus long et le temps de téléchargement plus court.

Le contraire est vrai si j'utilise une compression faible.

Le problème ici est que si je choisis une compression trop faible, le chargement des images sur mon site prendra beaucoup plus de temps. Si je choisis trop de compression, alors je crois que la valeur TTFB (time to first byte) sera élevée. Si cette valeur est trop élevée, Google peut voir ma vitesse de chargement de l'image ralentir.

Actuellement, pour la version de bureau de mon site, j'utilise des images en taille réelle avec une qualité JPEG de 80% et, pour un site mobile, une qualité de 66%.

Je crains que si j'augmente la qualité de l'image (réduction de la compression) sur l'un ou l'autre site, il y aura plus de données à télécharger et certaines personnes pourraient être facturées cher pour l'utilisation des données. Mon autre option est d’ajuster davantage la taille de l’image, mais si je suis trop petit, les visiteurs risquent de se plaindre.

Alors, quelle est la meilleure chose à faire? ajuster la qualité d'image JPEG à différentes valeurs (valeurs optimales)? ou dois-je réduire les images et prier pour aucune plainte?

1
Mike

L'article est trompeur car il suggère que le serveur doit compresser le contenu à la volée pour chaque client et le compresser à chaque fois. C'est un gaspillage de cycles.

Utilisez le meilleur des deux mondes:

Vous compressez vos images ne fois le mieux possible (pngout, zopflipng, plug-in irfanview webjpg), puis vous désactivez la compression côté serveur pour les images et publiez les images précompressées. Si vous générez des images afin que vous ne puissiez pas les précompresser, arrêtez cela.

Étape 1: Compressez vos images aussi bien que possible. Désactivez le dernier octet même s'il dure plusieurs minutes pour une image.

Étape 2: Indiquez à votre serveur avec .htaccess que vous n’avez pas besoin de la compression du serveur pour les images.

RewriteRule "\.jpg$" "-" [T=image/jpeg,E=no-gzip:1]
RewriteRule "\.gif$" "-" [T=image/gif,E=no-gzip:1]
RewriteRule "\.png$" "-" [T=image/png,E=no-gzip:1]

ou globalement (il faut alors tout précompresser)

SetEnv no-gzip 1

(Si vous avez d'autres fins comme jpeg au lieu de jpg, ajoutez-le aussi).

Le temps de décompression côté client est négligeable. En fait, plus la compression est efficace, plus la décompression est rapide.

1
Thorsten S.