32 documents tagged with “Core Web Vitals”

Back to all tags.

Core Web Vitals are Google's essential set of metrics designed to reflect website loading speed and user experience.

Cumulative Layout Shift (CLS) Metric: How to Find and Eliminate Unwanted Page Shifts

Do ads on a website push the text you’re reading out of view? Frustrated when content shifts just before you click and you end up clicking somewhere else by mistake?

Core Web Vitals

Core Web Vitals (CWV) is Google's essential set of metrics designed to reflect website loading speed and user experience. Let's explore which metrics it includes, why they matter, and how to measure them.

First Contentful Paint (FCP)

First Contentful Paint (FCP) is a metric that measures the time from the start of page load to the moment the browser renders the first piece of content on the page.

Interaction to Next Paint (INP) Metric: Tackling Slow Interactions

Google introduces a new metric, Interaction to Next Paint (INP). In March 2024, as part of the three most important Core Web Vitals metrics, it will replace First Input Delay (FID).

Largest Contentful Paint (LCP) Metric: A Guide to Faster Web Loading

The world of Largest Contentful Paint (LCP) metrics is like adrenaline-fueled auto racing—a constant race against the clock.

PageSpeed.cz Score (SPS): How we measure web speed for users?

We present a single number that acts as a proxy metric for Core Web Vitals on mobile and desktop. We call it the PageSpeed.cz Score (SPS).

Time To First Byte (TTFB)

TTFB shows the speed of the server (or infrastructure), the backend parts of the application, and also the network speed between the server and the user’s browser.

Domains Report

The Domains report shows the speed status of measured domains. It is the most important report for tracking the speed development of the entire website.

Summary Report

The landing page, the so-called “Summary,” provides a quick view of your site’s current speed across different contexts and measurement types

How to Find the LCP Element

For optimizing LCP, it’s essential to be able to find the “LCP element,” which is the largest element in the browser’s viewport for a given user. The display time of this element determines the LCP metric.

LCP Metric Optimization

Let’s explore what problems with the Largest Contentful Paint (LCP) metric you may encounter and how to optimize the metric as efficiently as possible.

Lazy-loading Images: A Detailed Guide

Lazy loading is a foundational and highly effective way to speed up page loads. We recommend conservatively deferring all images outside the first viewport. Be careful applying lazy loading to images that are LCP elements, as it can actually hurt speed.

BFcache: Speed Up Back and Forward Navigation

Back/forward cache (BFcache) is a browser optimization that makes back and forward navigation instant. It greatly improves browsing experience, especially for users on slower networks or devices.

Cloudflare: Your Secret Weapon for a Faster, More Reliable Website (with Checklist)

Cloudflare acts as a gateway between your website and its visitors. Unlike a standard CDN (Content Delivery Network), it’s more than just a system for distributing images and files.

CLS: How to Keep Element Heights (Images, JS Components, Iframes…)

This article explains why and how to ensure element dimensions at the HTML or CSS level for elements inserted asynchronously, such as <img>, <iframe>, or JavaScript components.

Cookie Banners and Website Speed

Is your site speed dialed in? Great, but you may not have deployed a cookie banner yet.

Web Compression with Gzip and Brotli: Are You Doing It Right?

In PageSpeed.cz we tackle very specific issues, and we’re often surprised by how deep we go. Data compression was no exception, and we’ll dive into it in this article.

Get Your HEAD in Order

We love WebExpo and performance. And we’re big fans of Harry Roberts, whose talks and articles always go in-depth.

Website Speed Monitoring: Why It Matters and How to Use It Effectively

Measuring speed once in a while isn’t enough. Without continuous speed monitoring you won’t uncover hidden issues, you’ll lack a data history for analysis, and you’ll easily miss trends that could cost your business conversions and visitors.

Backend Speed Optimization: How to Help

The backend plays a pivotal role in site speed optimization, because proper code- and server-side optimization can eliminate delays that often arise when processing requests and delivering content.

CLS Metrics Optimization

Let’s take a look at how to avoid CLS problems and how to remove them when they occur.

INP Metric: 7 Tips for Optimization

INP isn’t the easiest metric to optimize, so we’ve drawn from our experience the most common problems and how to fix them.

Image Optimization: Kilobytes, Pixels, and Milliseconds

Even everyday site owners can tame their images and make them work for you. Use WebP or AVIF, compress well, and don’t forget lazy loading.

How to speed up your Shoptet store: practical tips and common mistakes

Shoptet is fast if you don’t slow it down. We show how to optimize speed: what harms, what helps, and how to monitor your store.

Vue.js and Nuxt.js Optimization: Tips & Tricks

Boost Vue.js site speed with SSR, lazy loading, and more. Faster performance means happier users and higher conversions.

WordPress Speed Optimization: 6+1 Tips to Delight Google and Your Visitors

Site speed isn’t just a cosmetic detail—it’s a key factor shaping the success of your online business. Slow WordPress sites are often caused by poor plugin choices, bloated themes, or a lack of optimization know‑how.

Why Optimize Website Speed?

Psychology, conversions, and Google — why you should have a fast website too.

Speculation Rules API: The Path to Instant Page Loads

The Speculation Rules API lets us preload or even prerender another page. This approach enables near-instant loading of the page a user navigates to, improving their overall web experience.

PageSpeed.cz Study: The Impact of Chat Widgets on Website Speed

Live chat is used by 20% of Czech e-commerce operators. But how do these widgets affect site speed?

Test: Is it better to have many small CSS files or one big one?

In the PageSpeed.cz team we have several evergreen discussions, and one of the perennial questions is: Is it faster to have many small CSS files split by components, or a single large file?

Navigation Types

Understanding the different navigation types is important because some are much faster than others. From a speed optimization perspective, the goal is to convert as many users as possible to fast navigation types.

Testing Web Vitals in the Browser (A Developer’s Key Skill)

Core Web Vitals are the metrics we use to evaluate website performance in areas such as loading speed, interactivity, and layout stability. These metrics are increasingly important for delivering a good user experience, and Google uses them as a ranking factor in search results.