Compte rendu de la soirée performances web

Dans tous les cas, j’ai apprécié ce que j’ai entendu, de part la variété des contenus, des intervenants, et par l’ambiance très agréable de cette soirée.

Les intervenants de la soirée étaient Stoyan Stefanov (@stoyanstefanov), Anthony Ricaud (@rik24d), Éric Daspet (@edasfr) et JP Vincent (@theystolemynick).

Chacun à abordé la performance web selon un axe qui lui est propre avec la même passion, énergie, et expertise, ce qui est, ma foi, un gage de qualité et d’intéret pour un public de gros techos sans pitié (d’après le sondage de début de soirée, 90% de devs dans la salle).

Eric Daspet: Impacts des web perfs, rappels

Eric, initiateur de la soirée, à entamé la soirée en se présentant. Après un passage chez Yahoo!, il intégre SQLI comme consultant. Son mini-cv complet vous en dira plus à son sujet.

Cette introduction se focalise ensuite sur des chiffres, des graphiques, et ressemblera finalement un peu à un discours ‘évangélisateur’ à l’égard de son auditoire, pourtant déja convaincu.

Son contenu, toutefois, met en avant l’intime rapport entre performance web et bénéfices (pas seulement financiers, mais aussi en termes d’image de marque, de fidélité…).

Stoyan Stefanov: progressive rendering and download

L’auteur de l’excellent « Object Oriented Javascript » attaque sa présentation en rappelant l’importance des performances web, leur impact, mais aussi, point intéressant, les facteurs qui font varier l’impression de performance. En particuliers, un point sur lequel on n’aura pas, en tant que webdev, la main : la psychologie. Je vous invite à lire cet article, mais en résumé, voici les points clefs de cet article:

• Time is relative
• Keep flow in mind
• Consider the competition, the purpose of the page, the user expectations
• Try to answer « what’s the user perceived load time? »
• Provide feedback
• Transitions
• Progressive rendering
• Strive to render something (part of the page) in a blink of eye

Bien que je n’ai pas réussi à mettre la main sur l’exacte présentation de cette soirée, la suivante reprend assez fidèlement les points abordés.

Voices that matter: High Performance Web Sites

Notez que M. Stefanov nous a fait une très brève présentation d’un nouvel outil destiné à vous faciliter la vie en vous garantissant de meilleures performances, le Yahoo User Desktop Compressor. Un simple drag-and-drop du repertoire de votre site vous compressera tout ce qu’il est possible de compresser : js, css, images…

Il nous à présenté ce projet comme étant « top secret », mais nous savons bien que dans ces conditions… Bref, vous pouvez tester vous même cet outils pour Mac, *nux, Pc, sur son blog.

Anthony Ricaud: et les navigateurs web alors ?

Le porte parole des produits et de la philosophie Mozilla nous a fait la démonstration de ce que les browsers dedemain nous offriront. Rien de très neuf quand on fait de la veille, mais, malgré tout, que des petites fonctionnalités très sexy. Css 3, websockets, webGL… Bonheur.

Bien entendu, sous couvert de nous présenter le nouveau Firefox (ou serait-ce l’inverse ? …), on à le droit de réver que ces nouvelles fonctionnalités faciliteront le travail des mineurs du web tout en en simplifiant l’optimisation.

La présentation était piloté via iphone et websockets, c’est mignon ^^

Tiens au passage, y’a pas que vos sites web (et webdevs) qui essaient de travailler sur la performance percue… la preuve …

Inclure du javascript de manière performante, JP Vincent

L’inclusion de javascript. Derriere cet acte en apparence banal se cache un bouffe-ressources monstrueux. Jean Pierre Vincent nous fait donc part de ses recherches et expériences sur la question.

Sa présentation sera organisée selon les trois méthodes d’inclusion connues de tous :

• Inclusion dans l’entête
• Inclusion en bas de page
• Inclusion dans le DOM

Aucune de ces solutions n’est miraculeuse est parfaite, mais toutes ont le mérite d’être non bloquante pour le chargement et donc la lecture/utilisation de la page, ce qui, vous en conviendrez, est l’objectif de cette soirée et de ces débats.

Je vous laisse consulter l’intégralité de la présentation, code et exemple à l’appui bien sûr !

http://280slides.com/Viewer/?user=44205&name=perfs%20%3A%20inclusion%20de%20javascript&fullscreen

Et si on passait à l’action ?

Au final, mises bout à bout, toutes ces présentations ont apporté plein de petites idées, techniques… Mais comment passer à l’action ? Il n’y à qu’un maitre mot : organisation ! Ca ne vous mènera nulle par de courir dans tous les sens en cherchant la micro-optim’ qui n’apportera rien.

Commencez par un bench, et, en fonctions des réulstats, organisez votre riposte.

Un exemple? Le compte rendu des actions mises en place pour Mappy par Vincent Voyer, papa de Zeroload.net. Que du bon à prendre, et que du parfait pour comprendre sur un cas concret.

Enfin, pour passer à l’action, quoi de mieux de se revoir ? Eric Daspet à en effet émis l’envie de créer un vrai groupe de travail autours des perf web. Wait and see

Ils parlent aussi de cette soirée :

http://zeroload.net/blog/reflexions%20et%20retour%20sur%20la%20soir%C3%A9e%20performance%20web/