Pour conclure, les 2 points à retenir à propos de Page Speed Insight qui est un bon outil, mais…
- des résultats sont à relativiser ;
- rien ne remplace l’œil et l’avis d’un.e expert.e pour savoir quelles optimisations appliquer et comment !
Pages Speed Insight propose ainsi un système de notation sévère qui pousse aux optimisations webperf - et c’est une bonne chose ! En effet, s’il ne faut pas le prendre au pied de la lettre (ou du chiffre), il invite malgré tout à réfléchir aux moyens d’améliorer ses temps de chargement.
So I often find myself looking at WebPageTest (WPT) waterfall charts, but as I seem to have the memory of a chimpanzee (not a goldfish, that’s a myth) I tend to forget some of the details and what they all mean. So I decided to pull together many bits of information into a single blog post I can then refer to at a later date.
Heart est un outil open-source et modulaire d’automatisation d’analyses de qualité web. Il met à contribution Mozilla Observatory, Qualys SSL Labs Server et Dareboost pour produire des rapports de qualité Web et les publier sur Slack.
Basé sur PHP Typography de KINGdesk, l'outil permet de coller du texte à corriger en termes de microtypo, puis copier la version corrigée.
"The huge cost of ignoring accessibility when designing your website", Greg Williams (@dequesystems)
Besides enriching the lives of millions of persons with disabilities, practicing accessibility proactively protects your brand and bottom line.
Performance metrics are surprisingly challenging to get right.
Browsers don't always behave as we would want or expect them to, but we do have tools at our disposal to steer that behaviour towards the result we want.
Wikipedia reduceds the JS initial payload to fit within a budget of 28 KB. In total, the year-long effort is saving 4.3 Terabytes a day of bandwidth on our users' page views.
This talk looks at our perception of performance, some of the issues and challenges with our current approach to designing and delivering fast experiences.
[…]
How we design, develop and deliver our pages determines our visitor's experience.
To make sure your animations don’t cause performance issues, consider the impact of animating a given CSS property. Avoid layout recalculations and minimize repaints. Where you can, stick to changing transforms and opacity.
So with a little bit of JavaScript, backend code and some thought, it is possible to deliver your website using less data.
Les fonctionnalités sont nombreuses et permettent d’améliorer grandement l’expérience utilisateur. L’impact écologique est moindre, ce qui n’est pas négligeable non plus.
Yes, we need to better prioritize our asset delivery, but most importantly, we need to stop delivering so much JavaScript. We need to audit our script inventory, and scrutinize our 3rd party integrations regularly, as many of these packages are abandoned or meant to be short-lived.
Pour éviter l’effet de flickering, l’internaute voit une page blanche en attendant que la page définie dans le cadre du test A/B s’exécute et s’affiche. Autrement dit, l’affichage est volontairement ralenti pour éviter de servir une première version de page qui disparaîtrait pour laisser place à celle qui doit s’afficher pour le test.
Let’s take a look at all of the different Resource Hints we have available to us, real-world examples of how best to use them, and learn about some of the more obscure intricacies and gotchas that we need to be aware of if we want to really get the best out of them (and to make sure that we really are being smarter than the browser).
"Page visibility and performance metrics", Eryk Napierała (@erykpiast) and Paweł Lesiecki (@liseuek)
We believe that data from inactive tabs should be considered unnecessary and distorting the picture.
Interesting take, even if I find it ambiguous to use "FirstMeaningfulPaint" for a Custom Metric. The issue with data from inactive tabs once again highlight that one should always back up their RUM findings with Synthetic Monitoring.
Early Flush the HTTP response, for faster head interpretation
Preloading and prefetching to optimize Instagram feed performance
DOM reflow or layout thrashing should always be kept at a minimum in order to increase performance and provide a fluid, nonblocking user experience.