meetup Paris Webperf

Le monde de la performance web était réuni pour un meetup chez Mozilla. Au programme de cette belle soirée : Nicolas Hoizey, Directeur Innovation chez Clever qui nous a proposé les solutions pour faciliter la mise en œuvre des images responsives et Aniss Boumrigua, IT Manager chez Rue du Commerce, qui nous a présenté comment Rue du Commerce a intégré la web performance dans le cadre de la refonte globale de son site.

Les images : un enjeu stratégique pour la webperf !

La technique des compressives images, méthode qui consiste à servir des images deux fois plus grandes faiblement compressées sur des écrans retina, c'est terminé ! Il y a des habitudes qui sont ancrées et celle-ci fait presque office de marronnier dans le milieu du front-end. Idem, il ne s'agit plus de déterminer des tailles d'images de manière arbitraire, mais plutôt de vous pencher sérieusement sur les dimensions les plus couramment utilisées emplacement par emplacement (méthode détaillée dans les slides ci-dessous). Un travail d'artisan qui mérite d'être automatisé. L’intégration HTML se déroule au niveau de la balise img avec une série de nouveaux attributs qui sont détaillés dans cet article >>

Attention la balise doit-être utilisée uniquement pour des problématiques de direction artistique, c’est à dire : si on a besoin d’afficher une image avec un ratio différent en fonction du support. Au niveau des outils, il en existe beaucoup et chacun répond à des problématiques diverses. Vous pourrez les retrouver dans la présentation de Nicolas. Et pour ne plus rien rater sur l'évolution des techniques en responsive image je vous invite à suivre Jason Grisby @grigs, auteur d'une série de neuf articles sur le sujet, Tim kadlec (@tkadlec) ou encore Nicolas Hoizey (@nhoizey).

La présentation de Nicolas Hoizey :

Et voici la vidéo de sa présentation :

Rue du commerce, le modèle à suivre ?

Rue du commerce, c'est 25% de part de marché dans le high-tech ! Autant vous dire que la webperf est un enjeu stratégique. Des millisecondes de gagnées se traduisent par une augmentation du taux de transformation. Aniss Boumrigua nous a présenté comment à l'occasion d'une refonte globale ils ont réussi à optimiser drastiquement leur taux de transformation.

La première étape a été de redéfinir une stack technique moderne et mettre en place les conditions nécessaires pour déployer rapidement de nouvelles features. L'objectif était d’optimiser le TTFB, une métrique très chère à notre ami Google et son crawler. Les résultats ont été immédiats. Mais côté front-end, l'utilisateur ne percevait pas cette accélération.

L’équipe se retrousse alors les manches pour passer à la seconde étape, accompagnée cette fois par Fasterize, qui a consisté à optimiser la partie front-end. En six mois, les optimisations ont été déployées une à une et les dizaines de millisecondes sont tombées les unes après les autres comme autant de victoire. Un travail récompensé dans le classement du JDN ! Il ne s'agit pas de vous faire le listing des optimisations mises en palce, mais je vais vous donner quelques points importants cités par Aniss Boumrigua.

  • Mettez vous en position d’aller vite, déployez, testez rapidement
  • Acquérir un outil de RUM (Real user monitoring) et déterminer les métriques de références à suivre : speed index, start render et TTFB.
  • Évangéliser et travailler de concert avec les services marketing, infrastructure. Chaque décision devrait être prise sous le prisme de la webperf.
  • Faire un benchmark de la concurrence pour voir les techniques utilisées et reproduire. Un bon conseil, analysez en détail le site de Rue du Commerce 🙂
  • En mode test and learn. Mettre en place une optimisation, valider la pertinence et rollbacker si nécessaire.

Une présentation ponctuée par des GIF légendaires !

Et si vous préférez la version filmée,
voici la vidéo :

Vous avez été nombreux ce mercredi soir à partager ce moment de convivialité. Ses précieuses millisecondes à écouter des experts vous donneront certainement un avantage compétitif face à vos concurrents.

Évidemment, je ne vous ai pas tout raconté. La soirée se termine autour du combo pizza / bières, mais surtout de quelques tricks qui s'échangent sous le manteau. Le genre d’information que l'on partage en famille 🙂

Ne ratez pas le prochain meetup, inscrivez-vous pour rester informé.e !

Et vous pouvez aussi nous suivre sur twitter ou LinkedIn, pour bénéficier aussi des astuces de nos experts webperf !

VOUS AIMEREZ PEUT-ÊTRE AUSSI...

Quel était le site e-commerce le plus rapide du Sa... Le 21 mars dernier se déroulait le salon E-commerce One to One de Monaco. A cette occasion, nous avons lancé des tests sur plus de 300 sites...
Analyser la performance d’un site web via Go... Saviez-vous que vous disposez probablement déjà d’un outil d’analyse automatique de la performance de votre site web ? Google Analytics prop...
Retrouvez-nous au E-commerce One to One de Monaco Pour la première année, Fasterize sera présent au salon e-commerce 1to1 de Monaco. L’occasion pour nous de rappeler que la vitesse de charge...
Classement webperf : quels sont les sites les plus... Il y a du nouveau dans les classements webperf ! Désormais, un classement tourisme s'ajoute aux classements habituels (le classement général...