Tagged “web performance”

Mitigating CLS Caused by Promotional Banners: A Practical Solution
Let's explore a practical solution for mitigating Cumulative Layout Shift (CLS) caused by promotional banners on websites. It explains how to prevent unexpected layout shifts by using sessionStorage to remember the banner's content and display state across page loads.
Read more →
Talk: How I made the web more responsive — real-world case studies of INP optimizations
In May 2024, I began speaking at local meetups and conferences about enhancing web responsiveness. Specifically, I discuss debugging and avoiding slow interactions based on my experience on auditing Interaction to Next Paint (INP) on clients' websites. Find here videos, slides, dates and locations my talk.
Read more →
Jake Archibald's talk "In the loop", transposed
Jake Archibald's talk "In the loop" is still one of the best sources of information on how browsers process tasks and are able to respond to user input. As I didn't find anything as comprehensible as that in text format, I transposed his talk into this blog post.
Read more →
How to use scheduler.yield to improve web pages responsiveness
Google Chrome is introducing a new feature called scheduler.yield. This feature allows web developers to explicitly tell the browser to yield control to the main thread. Here are the key points.
Read more →
Preparing for Interaction to Next Paint (INP), a new Core Web Vital starting March 2024
As a web performance consultant, I'm always on the lookout for new developments that impact the user experience of websites. One such upcoming change is the introduction of a new metric called Interaction to Next Paint (INP) by Google. Set to become a Core Web Vital in March 2024, INP is designed to measure the time it takes for a website to respond to user interactions. In this blog post, we will delve into what INP is, why it matters, and how companies can prepare themselves to ensure their websites meet this crucial web performance metric.
Read more →
Talk: How and Why ($) to optimize web performance in 2023
In 2023 I've been speaking about web performance at conferences, Google Developer Groups (GDG) and local meetups all over Europe. The title of this talk is "How and Why ($) to improve web performance, practical tips for 2023".
Read more →
Quicklink case study: faster pages, increased page views
Quicklink is a lightweight library created by Addy Osmani (Google) that prefetches pages linked to the current page, as the links to those pages enter the visible portion of the page (viewport). Here's a case study for it.
Read more →
How to cap image fidelity to 2x and save 45% image weight on high-end mobile phones
With the rise of very high density “super retina” displays in the newest high-end devices, capping image fidelity to 2x leads to a big improvement in terms of rendering speed, and no perceivable quality loss for your users. Here’s a new best practice on how to do that.
Read more →
Critical CSS with Jekyll and SASS
My blog used to be run by Jekyll on GitHub pages and its CSS was built using SASS. Today I decided to boost performance even more inlining the render-blocking critical CSS, but even searching the internet I struggled to find an easy way to do it. This post is for you, in case you want to do the same.
Read more →
Responsive images, an HTML 5.1 standard
It's official. Responsive images are a W3C recommendation since November 2016, featuring the brand new picture tag and new attributes for the img tag: srcset and sizes
Read more →
A new LazyLoad to improve your website performance
In the latest days I've been working on websites performance optimization and I realized that there is no way to take advantage of the progressive JPEG image format on websites if you're using jQuery_lazyload from Mika Tuupola, so I decided to write my own lazy load, which turned to be better for multiple reasons.
Read more →

See all tags.