Magazine Internet

Comparatif web performance des candidats 2012 - Prélude

Publié le 27 mars 2012 par Samuel Martin
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.

La web performance c'est quoi ?

La web performance se découpe en plusieurs volets, classiquement on les nomme ainsi :
  1. La génération de la page : BACKEND
  2. La diffusion des données: NETWORK
  3. Le rendu du document : FRONTEND

Générer la page

ServeurLa génération de la page concerne le serveur, on parle de "BACKEND". Dans les schémas modernes cela fait très souvent appel à un ensemble de langages et de technologies différentes : routage url , appel à la base de données, passage à un moteur de template etc.. C'est le métier du serveur et cela ne nous intéresse pas pour deux raisons : 1. Si nous ne faisons pas partie de l'équipe de développement, nous n'y avons jamais accès 2. Cela ne représente rien face à la performance coté client.  

Recevoir les données

FibreBien que la partie NETWORK soit intéressante, c'est une étape considérée la plupart du temps par les grands comptes. Assez récemment et en pleine expansion pour accélérer le chargement on utilise de plus en plus la méthode des CDN. Voyez cela comme des autoroutes de l'information.Quelques vérités générales pour comprendre la partie NETWORK:
  1. Moins vous utilisez le réseau et plus le chargement de votre site est rapide
  2. Moins il y a de noeud séparants le client du serveur plus le chargement est rapide
  3. Quand le chemin est déjà connu, on a toujours un peu d'avance
  4. Quand on parallélise le chargement, les données sont reçues plus rapidement. Au lieu de télécharger élément par élément on télécharge quatre par quatre.
   .

Afficher la page

BrowserUne fois la page générée par le serveur, transmise sur le réseau et récupérée sur le poste client, il ne reste plus qu'à l'afficher. C'est une étape complexe pour votre navigateur et stressante pour votre processeur, sachez-le. Plus la page contiendra d'images,  plus votre code sera mal écrit, plus la génération prendra du temps.Les experts parlent souvent de la loi des 20% / 80%.  Sachez que 80 % des gains peuvent être obtenus côté client, donc penchons nous sur cette partie. En effet comme vous pourrez le constater dans les prochains articles, quelques lignes de code dans un fichier de configuration et une optimisation automatique des images permet de gagner déjà beaucoupAfin d'éviter les railleries : Oui on commence à s'intéresser aux performances côté client lorsque les performances côté serveur ne posent pas de problème. De mon point de vue, je dirais que passer une seconde à générer la page devient non négligeable (modulo le type de serveur et la particularité du site). On ne demande pas les mêmes performances à un blog et un service web permettant d'effectuer des traitements d'images. 

Les français et leur équipement numérique

TracteurContrairement au parc informatique d'une entreprise, le web est un joli bourbier où on ne contrôle ni la diffusion, ni le rendu. C'est d'autant plus vrai aujourd'hui. Au niveau de l'équipement on a historiquement le 56k, l'adsl dégroupé non dégroupé avec tout un panel de débit et de latence, le wifi, le wimax, le satellite, la 2g, la 3g, 4g, la fibre... Pour simplifier le tout, on consomme aujourd'hui l'information sur tout type d'écran, du téléphone à l'écran de télévision en passant désormais par les tablettes. Aucune machine n'a les mêmes capacités de calcul ni les même navigateurs (Internet Explorer, Chrome, Opera, Safari, Firefox etc).Vous comprendrez que vouloir donner des chiffres, tenter de se fixer des objectifs et finalement vérifier les données n'est pas tâche aisée, mais rien d'impossible.
Une seule règle : Testez votre site depuis un modem 56k, vous verrez, vous allez vouloir aller à l'essentiel, vous appliquerez  des corrections de bons sens et vos clients seront ravis.
Pour faire simple, privilégiez toujours les corrections rapides comme la compression systématique des données non compressées, la réduction des requêtes http,  la concaténation des fichiers js & css ...  une checklist est en préparation avec des vrais spécialistes.

Quelques chiffres ici et là

le débit moyen en France en 2010 était de 8 Mbits en téléchargement et 1 Mbits en envoi.http://www.techyou.fr/2011/03/17/le-debit-internet-moyen-en-france-8-mbits/Converture ADSL : http://www.ariase.com/fr/haut-debit/acces-departements.html90% ont le haut débit (insee)http://www.rue89.com/2012/03/01/internet-la-campagne-ca-rame-toujours-severe-229806

Vous pourriez être intéressé par :

Retour à La Une de Logo Paperblog

Ces articles peuvent vous intéresser :

LES COMMENTAIRES (1)

Par Sébastien
posté le 03 avril à 12:37
Signaler un abus

En complément : L'idéal reste de réaliser des tests de charge avec un outil professionnel en "RBVU", capable de simuler une multidude d'internautes virtuels en utilisant de vrais navigateurs, puis de générer un rapport de perf détaillé. Ces tests vont permettre d'observer le comportement du site sur chacune des 3 étapes évoquées dans le présent article : Backend, Network et Frontend peuvent ainsi être identifiées dans le "Waterfall Chart" (détail des requêtes et réponses pendant le chargement d'une page web). Pour ce type de test, vous pouvez utiliser CloudNetCare. Cet outil de test de charge est en français et gratuit jusqu'à 25 utilisateurs.

A propos de l’auteur


Samuel Martin 21 partages Voir son profil
Voir son blog

l'auteur n'a pas encore renseigné son compte l'auteur n'a pas encore renseigné son compte l'auteur n'a pas encore renseigné son compte

Dossiers Paperblog

Magazine