Adaptive Images - Des images adaptées auto aux résolutions écran

Adaptive images est un kit Javascript et PHP permettant d'optimiser l'affichage de vos images en fonction de la résolution de votre navigateur.

Toujours à la quête de l'optimisation frontend des sites web, Adaptive Images vous permettra de gagner énormément en ressources en proposant une version de vos images adaptée à la taille de votre navigateur.

Imaginons que vous proposiez une image de 242kb sur votre site web, adaptée pour les grosses résolutions... les navigateurs mobiles vont télécharger la même image, mais souvent sur un réseau mobile ! Lent, très lent !

Grâce à Adaptive Images, vous n'avez rien à modifier dans votre code, simplement intégrer le fichier .htaccess, le script et fichier PHP pour redimensionner à la volée (si image non présente en cache) pour la version miniature.

Concrètement, le fonctionnement est simple: Le javascript test la résolution écran et la stocke dans un cookie, le .htaccess détecte les requêtes sur des images et les renvoie à un fichier PHP qui se charge de créer les miniatures si elles n'existent pas encore.

On passe donc de 242kb à 39kb pour notre smartphone. Imagnez donc le temps de chargement gagné lorsque l'on a une vingtaine d'images comme celle-ci !

Site Officiel