mercredi, 28 mars 2012

Comparatif web performance des candidats 2012 - les images

Bien que tous les candidats souhaitent s'adresser au plus grand nombre de citoyens, voyons voir si leur site web le leur permet vraiment. Ici je propose de vous focaliser sur la partie "images". Si vous voulez comprendre brièvement les différentes étapes de la web performance l'article "prélude" est pour vous.

Le protocole

Tous les résultats sont issus de l'extraction des images de la page d'accueil des candidats 2012, le 10 mars 2012.

Les images retenues sont au formats PNG, GIF et JPG.

L'outil d'extraction utilisé est l'extension Image Picker 1.0 pour Firefox. Le logiciel d'optimisation utilisé est ImageOptim pour MacOs. Tous les optimisations effectuées sont automatiques.

Les données brutes

Candidats Nombre d'image Avant optimisation Après optimisation Gain en Ko Ratio poids/images
Arthaud 21 1074 ko 637 ko 437 ko 30 ko
Bayrou 69 2706 ko 2233 ko 473 ko 34 ko
Cheminade 19 391 ko 382 ko 9 ko 20 ko
Dupont 19 467 ko 427 ko 40 ko 22 ko
Eva Joly 29 1129 ko 994 ko 135 ko 34 ko
Hollande 41 3834 ko 288 ko 3548 ko 7 ko
Lepage 31 563 ko 430 ko 133 ko 14 ko
Le Pen 39 1437 ko 1322 ko 115 ko 34 ko
Melenchon 55 804 ko 666 ko 138 ko 12 ko
Poutou 62 849 ko 720 ko 129 ko 12 ko
Sarkozy 37 901 ko 846 ko 55 ko 23 ko
Villepin 46 4323 ko 3336 ko 987 ko 73 ko

Au vue des statistiques 2011 il apparait que le poids total moyen des images pour un site est de 600ko pour 75 éléments. Ce qui nous donne un ratio 8ko / image. Je ne connais pas l'écart type mais cela donne déjà une idée pour faire vos propres comparaisons.

Analyse

Avant Optimisation automatique

Pour être raccord avec le monde politique, carton rouge pour le candidat François Hollande, l'optimisation est tout simplement ahurissante. En regardant de plus près on s'aperçoit que deux images .png de 18 px x 53px sont à l'origine de 3.6 Mo. Je ne sais pas quel logiciel est utilisé pour générer ceci. Il est fort probable que les serveurs du candidat soient dimensionnés pour envoyer une grande quantité d'informations, mais imaginez un seul instant une connexion depuis un modem 56ko. En plus, c'est du gachis. Pour information après optimisation on passe de 3.6 Mo à 1.4 ko .

Parmis les ogres, nous retrouvons le site de François Baryrou avec 2.7mo, Arthaud avec 1mo, Le Pen avec 1.4mo, Eva Joly avec 1.1mo et enfin Villepin avec 4.3 mo de données images. Pour revenir aux statistiques globale de 600ko au mieux c'est deux fois plus que la moyenne mondiale au pire sept fois plus.

Après optimisation automatique

Les gains

Enorme surprise, un des pires devient le meilleur. Le site de François Hollande réalise un énorme gain avec 3.5 mo économisés. Hormis Cheminade tous les candidats peuvent profiter largement de cette optimisation qui prend 10 minutes. Le top 4 des meilleurs gains et donc des mauvais élèves: Hollande, Villepin, Bayrou, Arthaud

Les ratios après optimisations

Pour Hollande, le ratio tombe à 7ko par image. C'est le seul candidat capable d'accrocher la moyenne mondiale. Ensuite dans les bons résultats, on retrouve Melenchon, Poutou et Lepage.

Mais que nous indique le ratio ?
Au vue des résultats on s'aperçoit que malgré les optimisations jpg, png "simples" certains ratios indiquent que des efforts supplémentaires peuvent être faits, notamment sur le choix de résolution/qualité des jpg. Villepin apparait ici avec le plus mauvais ratio : 73ko par image.

Les "bons" candidats

La réponse est malheureusement aucun, tous peuvent faire plus d'efforts sur la réduction du poids de leurs images. La taille des images a un inpact important mais le nombre d'images aussi. Pour le bien être de tous les utilisateurs il semble raisonnable de limiter le nombre d'images à une soixantaine. Si malgré cela vous devez afficher un nombre important d'images au format jpeg vous pouvez utiliser la version "progressif" voir fournir une image réduite et charger la vraie image plus tard. Vous allez augmenter le poids de votre page mais accélerer le rendu. (A tester au cas par cas)

Notes

Via wget impossible de limiter les images à la page d'accueil tout en récupérant les images utilisées dans le css, si vous avez une solution élégante je suis preneur.

mardi, 27 mars 2012

Comparatif web performance des candidats 2012 - Prélude

Drapeau français Drapeau françaisPrenant une place de plus en plus importante, nouveau critère inpactant le référencement, la web performance est aujourd'hui un sujet brûlant. Passer les étapes désormais élémentaires à savoir "être présent sur internet" et "avoir un site agréable et joli", on cherche désormais un site rapide. Quantifiables et donc monétisables, les sites d'e-commerce sont aujourd'hui capables d'estimer assez précisément le coût de chaque millisecondes perdues. Assez rare pour le souligner, l'amélioration significative de la performance peut être en partie gérée par des processus automatique simple, c'est à dire apporter beaucoup avec très peu d'efforts contrairement à d'autres disciplines comme l'accessibilité, la sécurité ... Le gain est immédiat, c'est aisément percevable par la cible, le retour sur investissement est facilement calculable, ce qui explique l'engouement grandissant pour cette discipline.

Lire la suite

lundi, 30 janvier 2012

Stratégie de sauvegarde - Partie 2

Rembobinons. Dans la première partie, nous avons conclu que le plan le plus sûr de stockage de données ressemble à peu près à ceci:
  • disque sur la machine locale : original ou copie master ;
  • disque de stockage en réseau : copie commune ou partagée ;
  • le stockage hors ligne, qui signifie de nos jours stockage à distance dans le nuage (le « Cloud » en anglais) ou sauvegarde en ligne.
Extrait du Magazine Full Circle 54 p18 - Allan J. Smithie (version FR)

Lire la suite

jeudi, 5 janvier 2012

Femme d'Ubuntu

Ubuntu Women

Ubuntu WomenCet été, l'équipe d'Ubuntu Women a élu, comme chaque année, ses chefs de projets. Parmi ceux-ci, il y a deux nouvelles venues, Cheri Francis et Jessica Ledbetter, ainsi qu'une responsable en place, Elizabeth Krumbach. Nous avons posé à ces dirigeantes des questions concernant leur travail jusqu'à ce jour et les objectifs actuels du projet d'UbuntuWomen.

Extrait du Magazine Full Circle 53 p43 - Elizabeth Krumbach

Lire la suite

Stratégie de sauvegarde

Il n'y a rien de pire pour un mordu d'informatique que l'idée d'une perte de données, surtout si ce « geek » est un accumulateur de trucs depuis une ou deux décennies. Nous sommes tous en train d'opter pour le numérique : musique, albums photographiques, correspondance, tout est si commode, tout, si éphémère.

Ce n'est pas bon pour l'état d'esprit de quiconque de savoir que les disques durs tombent en panne : la gravité, la surtension, les maliciels et la bêtise humaine font tous bien des ravages. Ce dont on a besoin, c'est un filet de sécurité ; une stratégie de sauvegarde. Oh, regardez ! il se trouve que j'en ai une…

Extrait du Magazine Full Circle 53 p17 - Allan J. Smithie

Lire la suite

jeudi, 24 novembre 2011

Django - Dénormalisation d'un queryset

Dans quelques rares cas, l'ORM de Django ne suffit plus. Lorsque votre requête est spécifique il existe plusieurs solutions que j'expose dans cet article illustré par le tri de liste.

Lire la suite

mercredi, 23 novembre 2011

Django - QuerySetManager - Bonnes pratiques

J'ai déjà parlé de l'intérêt des querySetManager et de leur mise en place dans un projet Django. Désormais avec un peu de recul et l'intervention d'Olivier Meunier (l'homme aux milles pseudonymes), il semble plus pertinent d'externaliser la création du manager et du queryset. C'est à dire, pour l'exemple ci-dessous, définir tout ce joyeux code en dehors de la classe "Project".

Lire la suite

jeudi, 6 octobre 2011

Avis VPC Boost, une bonne expérience client

Très souvent, dans un élan de rage, soif de justice, on empoigne le clavier pour dénoncer la boutique en ligne qui nous contriste avec ses délais prolixes et son S.A.V chimérique. Bref une fois n'est pas coutume. Je vais dire du bien d'une boutique, oui je vous assure. Cette expérience est mienne, si vous rencontrez des problèmes avec cette boutique, je suis peiné d'avance mais je ne peux vous aider.

Lire la suite

- page 1 de 25