Webperf : comment booster les performances d’un dispositif digital web ?

Le point sur le concept de performance web en 2017, ainsi que les principaux indicateurs de mesure de la webperf et la manière de les optimiser.

#Contexte

Si les fondamentaux du web né sous l’impulsion de Tim Berners-Lee  sont toujours les mêmes, à savoir d’un côté un navigateur client et de l’autre un serveur web, le web a connu bien des évolutions ! Parmi les dernières et pour ne citer qu’elles : 

  • Le protocole HTTP/2 : évolution du protocole HTTP apportant principalement le multiplexage des requêtes et la compression des entêtes HTTP permettant ainsi d'envoyer simultanément plusieurs requêtes aux serveurs. Les apports de HTTP/2 sont visibles dans le "waterfall" d’une page web, c’est-à-dire la représentation du chargement des éléments par le navigateur au cours du temps ;
  • Sous l’impulsion d’acteurs comme par exemple Let’s encrypt[1], Google[2], la généralisation annoncée de l’usage du HTTPS : associant pour rappel le protocole HTTP à un algorithme de chiffrement pour davantage sécuriser les échanges, le S faisant référence à Secure ; 
  • Progressive Web Apps (PWA)[3], service workers, mode offline, web push notifications... :  visant à améliorer sur le web l’expérience utilisateur ;
  • Accelerated Mobile Pages (AMP)[4] : un HTML "light" initié par Google pour accélérer l’affichage des pages sur mobiles ;
  • Recommandations HTML du W3C : la version 5.1 est normalement prévue pour fin 2016[5] ;

Si ces évolutions sont censées contribuer à enrichir notamment l’expérience utilisateur et le spectre des usages possibles, d’autres réalités du web que nous utilisons au quotidien sont à prendre en considération. Ainsi sur les 6 dernières années, selon http Archive, le poids moyen des pages web a plus que triplé[6]. 

Aussi à l’heure où les e-commerçants tentent de battre tous les records lors des fêtes de fin d’année (Sources : le 11/11 d’Alibaba donnant un aperçu du e-commerce du futur[7] et l’annonce du FEVAD prévoyant une croissance de l’e-commerce français de 10% à Noël[8]), des questions se posent :

  •  Que se cache-t-il derrière le terme performance web ?
  • Quels outils permettent de mesurer la performance d’un dispositif digital ?
  • La webperf est-elle encore une option ?
#Terminologies

La performance des pages web ou webperf est l’arbre qui cache la forêt d’un ensemble de terminologies. Dans les principaux termes et en les catégorisant entre navigateur client et serveur on peut citer :

Termes côté navigateur client : poids de la page, nombre de requêtes, Speed Index[9], Start Render, cache côté client, éléments tiers appelés par une page web (ex : plugin réseaux sociaux, tracker), Time To First Byte, Time To Interact, Visual Complete, Lazy loading

Termes côté serveur : bande passante, minification des fichiers (JavaScript, CSS), cache côté serveur, compression des données, CDN

#CommentMesurerLaWebperf

Difficile parfois de s’y retrouver dans cette jungle de termes ! Heureusement, pour faciliter la mesure et l’analyse de la webperf d’un dispositif web, de nombreux outils existent. Pour ne citer qu’eux : 

Au global, ces outils offrent les fonctionnalités suivantes :

  • Mesure de la performance depuis différentes localisations géographiques et sur différents navigateurs ;
  • Indicateurs globaux sur la performance web, la qualité de la page analysée ;
  • Recommandations et pistes d’améliorations par rapport aux résultats obtenus sur les aspects suivants : poids de la page, nombre de requêtes, temps de chargement, HTML, optimisation des ressources chargées (images, CSS, JavaScript...), mobile friendly, SEO, usage du cache, sécurité…

Au regard des analyses et indicateurs fournis aujourd’hui, force est de constater que la frontière entre webperf et d’autres thématiques du web est poreuse et les conséquences business peuvent être importantes. Ces autres thématiques du web sont notamment :

#Illustrations : 
  • Selon une étude de Soasta, les pages mobiles juste 1 seconde plus rapide occasionnent une augmentation du taux de conversion de 27% ;
  • Amazon a identifié une diminution de 1% de ses revenus à chaque 100ms de délai supplémentaire de chargement d’une page ;
  • Google a mis en évidence qu’environ la moitié des visites sur des sites web mobiles sont abandonnées si le chargement met plus de 3 secondes ;
  • Selon Webpagetest.org, en utilisant une connexion 3G rapide, 3 sites mobiles sur 4 prennent plus de 10 secondes à charger et le temps moyen de chargement est de 19 secondes ;
#ConclusionsEtPerspectives

Depuis fin octobre 2016, les usages mobiles et tablettes ont dépassé ceux du desktop[10]. Ainsi le terme « mobile first » est désormais une réalité. A l’inverse si les débits mobiles augmentent (la 5G est déjà annoncée[11]), les connexions mobiles haut débit à travers le monde ne sont à date pas encore légion.

Et surtout l’étape suivante consiste à analyser, exploiter les indicateurs et les recommandations fournis par ces outils pour déterminer comment améliorer la performance web de son dispositif digital :

  • Est-ce une origine Ergonomie/Design ?
  • Est-ce un problème de conception, d’architecture, de sécurité ?
  • Est-ce une mauvaise exploitation du dispositif digital (ex : poids des images) ?
  •  …
  • Ou plus vraisemblablement un mélange de l’ensemble des questions soulevées ci-dessus.

En conclusion, au même titre que le design, les tests au sens large et la tiers maintenance applicative, la webperf n’est plus une option. Par ailleurs, au regard des évolutions permanentes du web, l’évaluation de la webperf ne peut être du « one shot » et doit s’inscrire dans la durée en itérant pour identifier à chaque fois ce qui peut être amélioré !

[1]  Source
[2] Source
[3] Source
[4] Source
[5] Source
[6] Source
[7] Source
[8] Source
[9] Source
[10] Source
[11] Source