May 30, 2026

How We Made the Fastest Cookie Banner that Loads in 89ms

engineering6 min read

Cookie banners don't have to destroy your Core Web Vitals. Here's how we built the fastest cookie consent solution on the web.

Soon after launching c15t, Inth's open-source cookie consent standard, we ran a test.

We installed the most popular cookie consent solutions on identical Next.js applications and measured their impact. Not their features. Not their compliance capabilities. Just one thing: how long until the banner actually appears?

The results were staggering.

Cookie Consent Solution	Banner Load Speed
c15t	89ms
Osano	214ms
Usercentrics	445ms
OneTrust	514ms
Ketch	709ms

That's not a typo. The most widely-used consent management platforms take 3–5× longer to show a banner than c15t. On a fast website, 700ms is an eternity. It's the difference between a user seeing your content immediately and staring at a loading spinner, or a user starts interacting with the site and suddenly pops the banner up, or worse, having cookies fire before consent is even given by the user.

This matters more than most developers realise, and fundamentally, it effects the bottomline of your company.

The Performance Tax of Consent

All but only a few cookie banners work the same way: you paste a script tag into your <head>, and that script fetches a configuration from a remote server, parses it, renders a UI, and finally displays something to the user.

Each of those steps adds latency:

DNS lookup for the third-party domain
TLS handshake to establish a secure connection
Script download that's often 50–200KB of JavaScript
Configuration fetch, which is another round-trip to get settings
Rendering - injecting DOM elements and styles

By the time the banner appears, your analytics scripts may have already fired, your ads start loading, and your user's browsing session is being tracked by analytics that leaked. This isn't just a performance problem, it's a compliance failure, not to discount, its a complete lack of respect for your users privacy.

How c15t Is Different

We took a different approach. Instead of treating the cookie banner as an external service that gets injected into your site, we built it as a native part of your application.

Here's what that means in practice:

1. Bundled, Not Injected

c15t ships via your favorite JavaScript package manager or runtime. When you build a Next.js or React application for instance, the consent components are bundled right alongside your own code. No external script tags. No additional network requests. No waiting for a third-party server to respond. Learn more about how c15t works or get started faster and use c15t/skills with your agent;

bash

pnpm dlx @c15t/cli skills

Your bundler handles tree-shaking, code-splitting, and optimisation, just like it does for the rest of your application.

2. Zero External Dependencies at Runtime

Once your site is built, c15t doesn't need to fetch configuration from anywhere. The consent logic, UI components, and styling system are all included in your JavaScript bundle. When a user visits your site, everything they need is already there. Learn about the initialization flow.

This is the difference between shipping a self-contained application and building a site that has to phone home every time it needs to display basic functionality.

3. Framework-Native Components

We didn't build a generic JavaScript widget that tries to work everywhere. We built native React components that use React's lifecycle, state management, and rendering optimisations. The result feels like part of your app, because it is. Learn about the ConsentManagerProvider and ConsentBanner.

tsx

import { ConsentManagerProvider, ConsentBanner, ConsentDialog } from '@c15t/nextjs';

export default function ConsentManagerClient({ children }) {
  return (
    <ConsentManagerProvider
      options={{
        mode: 'hosted',
        backendURL: 'https://your-instance.c15t.dev',
        consentCategories: ['necessary', 'measurement', 'marketing'],
      }}
    >
      <ConsentBanner />
      <ConsentDialog />
      {children}
    </ConsentManagerProvider>
  );
}

Why 89ms Matters

Let's put that number in context.

Google's Core Web Vitals, a set of metrics that directly impact your search rankings, ad quality scores, accessibility etc, include First Contentful Paint (FCP) and Largest Contentful Paint (LCP). These measure how quickly your page becomes visually useful.

When a cookie banner takes 500ms+ to load, it often becomes the LCP element. That means Google's algorithms see your site as slower than it actually is, purely because of a third-party script.

With c15t's 89ms banner visibility:

Your actual content becomes the LCP
Your Core Web Vitals scores improve
Your search rankings don't suffer
Your users see content faster
Your ad spend can lower

But there's another benefit that's harder to measure: trust.

When a banner appears instantly, users know immediately that you're asking for consent. When it takes half a second (or longer), cookies have already been set. Even if you're technically compliant, the user experience suggests otherwise.

The Benchmarks Don't Lie

We built CookieBench to measure this objectively. It's an open-source tool that tests cookie banner performance across all major providers using identical conditions.

The methodology is simple:

Create a fresh Next.js application
Install the consent solution
Measure the time from page load to banner visibility
Repeat with consistent network conditions

c15t consistently scores in the fastest time. The closest competitor takes nearly 3× as long. The worst offenders take 5× as long or more, and that's the difference between a great user experience and a bad one.

What This Means for Developers

If you're a developer building a production application, you have three options for cookie consent:

Third-party scripts: The tag is easy to install, but you'll get terrible performance, can leak consent, and are questionable for consistent compliance.
Build your own: You'll have total control, but you NEED to understand consent compliance from head to toe, alongside a massive time investment, and an ongoing maintenance burden.
c15t: Bundled into your app, performant by default, compliant out of the box, easy to style to your design. The only option for high performance and full compliance.

We built c15t because, as developers we were tired having to fight bloated cookie banner scripts only to end with bad performance and sub standard styling. The 89ms banner visibility isn't just a vanity metric, it's a signal that your cookie consent solution is working with you and your application, not against it.

c15t and Inth: The Complete Solution

c15t is the open-source consent management library built as native React components. Inth is the consent infrastructure that runs c15t at scale.

When you use c15t with Inth, you get:

Zero ops: Inth handles the backend, keeping consent records durable across devices and sessions
Automatic jurisdiction detection: No configuration needed, Inth determines where users are and applies the right consent model
Server-side consent awareness: Your server knows when consent is given, enabling server-side analytics without leaks
Network resilience: If the backend is temporarily unavailable, c15t continues working and re-syncs when connectivity returns
Observability: Monitor consent rates, track compliance, and access audit logs through Inth's dashboard

This is the difference between a library and a production-ready solution. c15t gives you the code. Inth gives you the confidence to ship it. Learn about the client modes and backend integration.

Getting Started

If you're using Next.js or React, you can have c15t running live on your site in five minutes. Start with the quickstart guide.

Or Quick Start with CLI:

bash

npx @c15t/cli

Visit c15t.com/docs.

The CLI scaffolds everything you need: components, configuration, and styling. Your banner will be bundled with your application, optimized by your build process, and visible to users in under 90ms.

No external scripts. No performance tax. No compliance theatre.

Just a fast, functional cookie banner that respects both your users and your Core Web Vitals.

Want to see the benchmarks for yourself? Visit CookieBench to compare performance across all major consent solutions.

All Posts