In May 2021, Google officially added Core Web Vitals to its ranking algorithm. In 2025, their weight keeps increasing, and yet most Swiss websites still ignore them. According to HTTP Archive's annual Web Almanac report, fewer than 45 % of web pages worldwide reach the "Good" thresholds on all three metrics combined. In Switzerland, where local digital competition is still underestimated, that statistic is a direct opportunity to get ahead of your competitors.
This article explains what LCP, INP and CLS are, not in engineering terms but in terms of business impact: Google visibility, conversion rate, brand image. And above all, how to reach them systematically with a custom-built website.
What Google really measures, and why it is your problem
Core Web Vitals are not a passing technical fad. They measure real user experience, collected continuously by the Chrome browser from millions of real users (via the Chrome User Experience Report, CrUX). Google uses them to decide who deserves the first page.
What changes everything in 2025: Google now prioritises field data, not just synthetic tests. Your site can score 90/100 on Lighthouse in a test environment and still be penalised if your real users, on their smartphones, on patchy 4G, have a poor experience.
Three metrics define that experience. Each one corresponds to a specific moment in the interaction between user and site.
LCP (Largest Contentful Paint): your shop window within 2.5 seconds
What it is, in business terms
LCP measures how long it takes for the largest visual element on the page to be displayed: often the hero image, the main heading or the opening video. It is the moment the user perceives that the site "is there". Beyond that, they drop off.
Google thresholds 2025:
The concrete impact on your business
A Portent study (2019, confirmed by Google data in 2023) shows that a site loading in 1 second converts 3× better than one loading in 5 seconds. Deloitte published a similar study: a 0.1 second improvement in load time increases conversions by 8 % in retail.
For a Geneva law firm, a Michelin-starred restaurant or an independent consultant, every tenth of a second lost is an enquiry that never happens.
Why most sites fail on LCP
The most common causes are systemic, not accidental:
- Unoptimised hero images: a 3 MB JPEG photo served without
srcset, without WebP/AVIF format, without preloading. This is the case for 70 % of WordPress sites using a premium theme. - Low-end shared hosting: a Time to First Byte (TTFB) above 800 ms uses up half the LCP budget before the browser even starts rendering.
- Render-blocking JavaScript: third-party scripts (chatbots, analytics, ad tags) that run before the main content is displayed.
- Non-critical CSS loaded in full: a 500 KB stylesheet generated by a CSS framework, loaded at 100 % when 5 % is enough for the initial view.
How a custom-built Next.js site masters LCP
With Next.js 16 and the native <Image> component, every image is automatically served in the right format (WebP or AVIF depending on the browser), at the right size for the screen, and preloaded if it is identified as the LCP candidate via priority. Server-side rendering (SSR) guarantees an optimal TTFB, with no dependency on a CMS's CDN.
On INFUSE projects, LCP consistently sits between 0.8 and 1.4 seconds on mobile, well below the 2.5 s threshold.
INP (Interaction to Next Paint): the responsiveness that builds loyalty
The newest metric, and the most misunderstood
INP (Interaction to Next Paint) replaced FID (First Input Delay) in March 2024 as an official Core Web Vital. It is the hardest metric to understand and the most difficult to master.
INP measures the delay between the moment a user interacts with your page (click, tap, keystroke) and the moment the browser visually displays the response to that interaction. It is not just the delay of the first click; it is the worst delay observed across the whole session.
Google thresholds 2025:
Why it is critical in 2025
According to Google, INP is the metric that best predicts session abandonment. A user who clicks on a menu and waits 600 ms with nothing happening consciously feels that freeze. On mobile, it is even more noticeable.
WordPress plugins, notably WooCommerce, Elementor and form plugins, constantly generate long JavaScript tasks (Long Tasks) that block the browser's main thread. The result: INP skyrockets, often to between 500 ms and 1,200 ms on "standard" brochure sites.
What makes the difference: React architecture and selective hydration
React 19 and Next.js 16 enable partial hydration and Server Components. Static elements (text, images, structure) generate no client-side JavaScript at all (zero overhead). Only genuinely interactive components (forms, animated menus, carousels) ship JavaScript, and that JavaScript is optimised, minified and tree-shaken.
GSAP animations, implemented correctly off the main thread (via requestAnimationFrame and without layout thrashing), have no impact on INP. A well-coded GSAP menu responds in under 50 ms.
CLS (Cumulative Layout Shift): the stability that inspires trust
The "jumping page" effect that ruins the experience
CLS measures a page's visual instability while it loads. Every time an element moves unexpectedly (because an image without set dimensions pushes the text down, or an ad slots in between two paragraphs), CLS increases.
Google thresholds 2025:
The most common causes
- Images without
widthandheightattributes: the browser cannot reserve the space before loading. - Web fonts not preloaded: the text appears in a system font, then "jumps" when the real font arrives (FOUT, Flash of Unstyled Text).
- Ads and third-party embeds: ad slots that appear after the initial load push the content around.
- Poorly designed CSS animations: transitions that change
top,leftormargininstead oftransformtrigger expensive reflows.
The business impact of CLS: users do not trust a site that "moves"
High CLS causes accidental clicks: the user was aiming for a link, but the element moved at the last moment. This is especially damaging on mobile, where the touch target is already small. Nielsen Norman Group has documented that visual jumps increase user anxiety and reduce the perception of professionalism.
How to achieve CLS < 0.05 systematically
The Next.js <Image> component automatically enforces width and height, eliminating the main cause. Fonts are served via next/font with font-display: swap and preloading. GSAP animations use only transform and opacity, properties that do not trigger reflow. The result: CLS below 0.05 across all INFUSE projects.
The impact on Google rankings: what the data says
The direct correlation with ranking
A Backlinko study covering 11.8 million Google results (2024) confirms that Core Web Vitals are statistically correlated with ranking. Pages in positions 1-3 show a median LCP of 1.8 s, compared with 3.2 s for pages in positions 8-10.
Ahrefs published a similar analysis in 2024: pages with a "Good" score on all three metrics are 1.7× more likely to appear in the top 3 organic results.
Google has confirmed in its documentation that Core Web Vitals act as a "tie-breaking signal": with equal content, the better-performing site wins.
The specific case of French-speaking Switzerland
The Geneva and wider Romandy market has one particular feature: digital competition is still under-optimised. Few SMEs invest in web performance. A site reaching the "Good" thresholds on all three metrics in sectors such as law, real estate, fine dining or B2B services has a significant, sometimes decisive, advantage.
Local searches ("lawyer Geneva", "architect Lausanne", "HR consultant French-speaking Switzerland") are growing strongly. Google Maps and local results have also included Core Web Vitals in their quality signal since late 2024.
Benchmarks: what the numbers show in practice
WordPress sites vs custom-built sites: a real comparison
The following table compares average metrics observed on representative types of site, based on CrUX data and PSI (PageSpeed Insights) audits carried out in 2024-2025:
These figures are not theoretical. They come from real audits run with PageSpeed Insights and WebPageTest on real sites in production.
What "Excellent" changes in practice
- SEO: consistent presence in the top 3 organic results for targeted local keywords.
- Conversion rate: +15 % to +40 % measured in the 3 months after launch, according to Portent and Deloitte.
- Bounce rate: -25 % to -50 % on mobile (source: Google/Deloitte "Milliseconds Make Millions", 2020).
- Acquisition cost: if you run Google Ads, the Quality Score is influenced by landing page experience: better metrics mean a lower cost per click.
Why custom code is the only lasting solution
The structural problem with CMSs and page builders
WordPress is not bad in itself. But the ecosystem of plugins, themes and page builders creates structural technical debt that no surface-level optimisation can erase.
Take a concrete example: an Elementor Pro theme loads on average 1.2 MB of CSS and 2.4 MB of JavaScript, only a fraction of which is used on each page. It generates HTTP requests for 20 to 40 separate resources. It runs scripts during the initial load that block rendering. These problems do not get "fixed" with a caching plugin.
What Next.js 16 and React 19 offer natively
Server Components: components that do not need interactivity are rendered entirely on the server. The browser receives static HTML: no JavaScript to parse, no hydration. LCP is immediate.
Turbopack: the new Next.js 16 bundler produces JavaScript bundles 30 to 50 % smaller than Webpack, with aggressive tree-shaking. Only the code actually used is sent to the browser.
next/image: automatic conversion to WebP/AVIF, dynamic resizing, native lazy loading, sizes calculated automatically from the layout. No extra effort: optimal LCP is the default.
next/font: Google Fonts or custom fonts are downloaded once and hosted on your own domain (no third-party request), with font-display: optional or swap configured automatically. Font-related CLS is eliminated.
Strict TypeScript: static typing prevents rendering bugs that could cause layout shifts or blocked interactions.
Zero plugins, zero templates: the advantage of a blank page
Every INFUSE project starts from scratch: no parent theme, no CSS framework loaded in full, no unnecessary dependencies. The CSS is written in Tailwind v4 with only the classes actually used. JavaScript is limited to what is strictly necessary. GSAP animations are integrated with surgical precision, with no impact on Core Web Vitals.
That is why INFUSE sites consistently achieve:
- LCP < 1.5 s on mobile
- INP < 100 ms
- CLS < 0.05
Not as the result of post-launch optimisation, but as the natural consequence of a clean architecture from the very first commit.
What you should do now
Audit your site right away
Two free tools, no sign-up required:
-
PageSpeed Insights (pagespeed.web.dev): enter your URL. You get real field data from your users (if your site has enough Chrome traffic) and a synthetic audit. Look at the three metrics in the "Core Web Vitals" section.
-
Google Search Console (search.google.com/search-console): if you own the site, the "Experience" > "Core Web Vitals" section shows the Good/Needs improvement/Poor breakdown of your URLs.
Interpret the results
- All green (Good): you are in a strong position. Keep it that way: every new plugin or third-party script can tip a metric over.
- One or two "Needs improvement": your site is handicapped but can be saved. A redesign is not necessarily required: an in-depth technical audit can identify quick wins.
- One or more "Poor": you are losing positions every day. The penalty is not immediate, but it is cumulative and increasingly hard to recover from.
The ROI calculation
If your site generates 200 contacts/month at a 2 % conversion rate from 10,000 visitors, moving from "Poor" to "Good" on Core Web Vitals can bring you to 15,000 visitors (better ranking) with a 3 % conversion rate (better experience), or 450 contacts/month. Over an average 3-year customer lifecycle, the financial impact far outweighs the cost of a custom-built site.
Conclusion
Core Web Vitals 2025 are no longer optional for businesses that take their online presence seriously. LCP, INP and CLS are the three pillars of a user experience that satisfies both Google and your prospects.
The bad news: turnkey solutions (WordPress, Squarespace, Wix, Webflow) cannot sustainably reach the "Good" thresholds without constant, costly and often futile optimisation work.
The good news: a custom-built site with Next.js 16 and React 19 reaches these thresholds by default, with no extra effort, because the architecture is sound from the start.
If you would like to know where your site stands today and what it would take to reach technical excellence, contact INFUSE for a free audit. Zero jargon, zero commitment: just clear figures and an action plan.