The Embedded Image Preview (EIP) technique introduced in this article allows us to load preview images during lazy loading using progressive JPEGs, Ajax and HTTP range requests without having to transfer additional data.

le Synthetic Monitoring présente l’avantage d’offrir une stabilité que les données organiques n’ont pas, donc on en aura toujours besoin. C’est un moyen très efficace de détecter des changements dans la performance qui viennent de nous et non pas de l’environnement. Ces métriques sont toujours utiles sur du très long terme.

Site speed is a competitive advantage that directly influences your conversion rates.

The tools to make our websites fast and accessible are here but we’re not using them. And that’s what makes me mad […] it’s not just bad software design and development if a website is slow. Performance and accessibility aren’t features that can linger at the bottom of a Jira board to be considered later when it’s convenient.

Using the loading attribute as the sole approach for lazy loading will be the recommendation once WebKit and Safari implement support. For now, though, it should only be used as an enhancement and not as a replacement for existing strategies.

This is an experiment to see what amount of delay is too annoying for a user interaction like typing. Here are some presets; make sure to type a lot of characters at once for the full effect.

A great tool to wrap your mind aroung the values of your First Input Delay.

To summarise, using native lazy loading is one of the simplest ways of providing genuine progressive performance enhancements for your users. It’s not a perfect solution, but if you’re not already utilising lazy loading and have lots of images/iframes it’s definitely worth trying out — especially as it’s so easy to implement!

… we discovered that the origin server became infrequently unreachable. Since neither CDN nor origin server were showing any incidents, we initially were confused by these inexplicable periods of Origin unreachability.

Since the beginning, Google has insisted AMP is the best solution for the web’s performance problem. And Google’s used its market dominance to force publishers to adopt the framework, going so far as to suggest that AMP’s the only format you need to publish pages on the web. But we’ve reached a point where AMP may “solve” the web’s performance issues by supercharging the web’s accessibility problem, excluding even more people from accessing the content they deserve.

Using script injection in WebPageTest enables me to experiment, to explore the complexities of which origins to preconnect too and which ones to avoid, and evaluate the results before I get clients to start changing their code.

While a good TTFB doesn’t necessarily mean you will have a fast website, a bad TTFB almost certainly guarantees a slow one.

… la webperf, c’est avant tout de l’UX qui consiste à offrir une expérience de navigation fluide & rapide, afin de faciliter la consultation et l’achat de vos produits/services.

We’ll discover why front-end performance matters, how to measure your web application performance, and what tools you should use to collect these relevant metrics.

stale-while-revalidate helps developers balance between immediacy —loading cached content right away— and freshness —ensuring updates to the cached content are used in the future.

Total Blocking Time is a companion metric to Time to Interactive. For each task, it considers all time except for the first 50ms to be "blocking time". Total Blocking Time is, then, the sum of all the blocking time that fall between FCP and TTI.

Accessibility is a holistic practice, essential to some but useful to all. It is a practice that touches on many aspects of good web design and development, especially performance. This talk will highlight opportunities and techniques to improve your website or web app’s performance by embracing an accessible, inclusive mindset.

Have you ever been reading an article online when something suddenly changes on the page? Without warning, the text moves, and you've lost your place.

If you're using a web font, you're bound to see a flash of unstyled text (or FOUC), between the initial render of your websafe font and the webfont that you've chosen. This usually results in a jarring shift in layout, due to sizing discrepancies between the two fonts. To minimize this discrepancy, you can try to match the fallback font and the intended webfont’s x-heights and widths [1]. This tool helps you do exactly that.

"Eyes don't lie: understanding users' first impressions on website design using eye tracking"

Configuring TLS is perhaps the most complicated and error-prone of all IT tasks, and this tries to make it as easy as possible.