Consent Banner Load Time: The Script That Delays Your First Paint

Your consent banner is the first thing a visitor sees, and it is also the thing that makes the page slow. One test put the cost at over two seconds of Largest Contentful Paint, which is the difference between a page that feels instant and a page that feels broken.

What the banner costs

DebugBear measured the impact directly: a page with a LCP of 1.43 seconds rose to 3.61 seconds when a cookie banner was added, an increase of more than two seconds. The banner script itself is part of the cost. Consent management platforms load over 200 KB of JavaScript in some cases, and that script competes with the page content for the same network and processing time. The banner also causes layout shift when it appears, pushing content down or covering it, and it delays the moment the page's main content can paint.

The Interaction to Next Paint numbers tell the same story. Kukie's testing across 11 consent platforms found INP values ranging from 6 milliseconds to 468 milliseconds, a spread that shows how much the choice of platform matters. The best platforms add almost nothing. The worst add nearly half a second of input delay, which is enough for a visitor to feel the page lag when they tap or click.

The reason the cost is so high is that the banner script usually loads early, before the page content, because it has to: the banner has to be there before any tracking scripts run. That means it is in the critical rendering path, competing with the hero image and the headline for the browser's attention. A script that loads late is a script that cannot do its job. A script that loads early is a script that slows the page.

How to measure it on your own site

Measure with the banner and without it. Run a Lighthouse or PageSpeed test on the homepage with the consent banner enabled, then again with it disabled, and compare the LCP and INP. The difference is the banner's cost. Do it on mobile, because that is where the cost is highest: slower networks, slower processors, and smaller screens where the banner covers more of the viewport.

Then measure the layout shift. The banner's appearance should not move content. Reserve space for it, or overlay it without pushing content down. A banner that pushes the headline down by 200 pixels when it appears is a layout shift, and layout shift is a Core Web Vitals failure that Google measures and ranks on. The Global Privacy Control signal is the same trade-off at a different layer: a mechanism that has to run before tracking, and therefore runs before the page is ready.

The fixes that actually help

Load the banner script asynchronously, so it does not block the page render. Defer the CMP's heavier JavaScript until after the first paint, loading only the minimum needed to show the banner and record the choice. Choose a CMP with a small footprint: the difference between 6ms and 468ms of INP is the difference between platforms, and the platform choice is a performance decision as much as a compliance decision.

And keep the banner small. A full-screen takeover on mobile is slower to render, harder to dismiss, and more likely to cause layout shift than a compact banner at the bottom of the screen. Consent Mode has the same performance shape: the modelling gap is the cost of waiting for a decision that never arrives. AMP pages have their own banner component, and the same load-time rules apply there too.

Frequently asked questions

How much does a consent banner slow down a page?

DebugBear measured a page going from 1.43 seconds LCP to 3.61 seconds with a cookie banner added, an increase of over two seconds. The cost varies by platform: Kukie found INP values from 6ms to 468ms across 11 consent platforms, so the choice of platform matters as much as the banner itself.

Why does the banner script have to load early?

Because it has to be there before any tracking scripts run. The banner is the gate: nothing that needs consent can load until the visitor has answered. That puts the banner script in the critical rendering path, competing with the page content for load time.

How do I reduce the banner's performance cost?

Load the script asynchronously, defer the CMP's heavier JavaScript until after first paint, and choose a platform with a small footprint. Keep the banner compact, reserve space for it so it does not cause layout shift, and measure the difference with and without it on mobile.

Does the banner cause layout shift?

It can, when it pushes content down or covers it as it appears. Reserve space for the banner or overlay it without moving content. A banner that shifts the headline by 200 pixels is a Core Web Vitals failure that Google measures and ranks on.